@charset "utf-8"; 
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css'); 

p{font-weight: 400;}
b{font-weight: 600;}


.evt_wp{width: 100%; overflow: hidden;}
.evt_wp img{width: 100%; vertical-align: top;}
.evt_wp strong{font-weight: 900;}
.evt_wp .small{font-size: 12px; font-weight: 200; line-height: 27px;}
.evt_wp .red{color: #ee0043;}
.yellow{color:yellow;}
.inner [class^="tit"]{padding-bottom: 30px;}

.footerPc{position: sticky; z-index: 4;}

.evt_wp .fixed_left{position: fixed; top: 95px; left: 0; background: #635d4c; width: 37.5%; height: 100%; z-index: 3; display: flex; align-items: flex-end; justify-content: end; padding: 0 86px 129px 0;}
.evt_wp .fixed_left div{color: #eae8e2; font-size: 37px;  padding: 0 0 80px 0;}
.evt_wp .fixed_left div sup{font-size: 16px; vertical-align: super; letter-spacing: -2px;}
.evt_wp .fixed_left div strong{color: #fff;}
.evt_wp .fixed_left .bnr{width: 420px; margin-top: 20px;}

.evt_wp .btm_bar{position: absolute; left: 0; bottom: 0; width: 100%; z-index: 5;}
.evt_wp .btm_bar.fix{position: fixed; left: 0; bottom: 0;}
.evt_wp .btm_bar > .bnr{overflow: hidden; text-align: right; width: 1200px; margin: 0 auto; color: #fff; padding-right: 80px;}
.evt_wp .btm_bar > .bnr li{display: inline-block; background: rgba(0,0,0,0.85); padding: 30px 100px 20px; border-radius: 20px 20px 0 0; font-size: 22px; font-weight: 900; position: relative;}
.evt_wp .btm_bar .bnr li::after{position: absolute; top: 35px; right: 62px; content: ''; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg);
}

.evt_wp .visual_wp{position: relative; background: #cdc7b6 url('imgs/bg_visual.png') no-repeat 0 center;}
.evt_wp .visual{animation: slit-in-vertical .45s .5s ease-out both}
.evt_wp .visual_typo{position: absolute; right: 20px; bottom: 125px; animation: slide-in-bottom .5s cubic-bezier(.25,.46,.45,.94) both}
.evt_wp .visual_txt{position: absolute; top: 72px; left: 0; animation: slide-in-top .5s cubic-bezier(.25,.46,.45,.94) both}

@keyframes slit-in-vertical{0%{transform: translateZ(-800px) rotateY(90deg); opacity:0} 54%{transform: translateZ(-160px) rotateY(87deg); opacity: 0} 100%{transform: translateZ(0) rotateY(0)}}
@keyframes slide-in-bottom{0%{transform: translateY(1000px); opacity: 0}100%{transform: translateY(0); opacity: 1}}
@keyframes slide-in-top{0%{transform: translateY(-1000px); opacity: 0}100%{transform: translateY(0); opacity: 1}}
 
.evt_wp .content_box{width: 730px; padding: 10px 87px 30px; background: #f4f2ec; border-radius: 10px;}
.evt_wp .object{position: absolute; top: 80px; right: -320px; width: 440px;}

/*동의함 css*/
.con2_bg{position: relative;}
.agree-ctrl{padding-right: 10px;}

.evt_wp .noti{box-shadow: 0 1px 7px rgba(0,0,0,.09); width: 730px; margin: 15px 0; padding: 30px 80px; color: #000; border-radius: 10px; text-align: left;}
.evt_wp .noti strong{display: block; margin-bottom: 8px;}
.evt_wp .noti em{font-weight: 800;}
.evt_wp .noti p{line-height: 1.5;}
.noti_p{text-decoration : underline;}
.noti_p a{display: inline-flex; text-decoration: none;padding-left: 9px;line-height: 1.3rem;}
.noti_p p::before{content: '·' !important;text-decoration : none; }
.evt_wp .noti_prize p::before{content: '-'; margin-left: -10px; margin-right: 3px;}
.noti_p {color:#808080; font-size:0.85rem;}

.noti_2 p{   
  width: 100%;
  border: 1px solid #808080;
  padding: 15px 30px !important;
  margin-top: 10px;
  border-radius: 10px;
}

.noti_2_bm{
  border-radius: 8px;
  padding: 3% 5%; 
  background-color: #d33; 
  margin: 0 auto; 
  color: #fff;
  margin-top: 14px;
  display: flex;
}

.noti_3{background-color: #f4f2ec;box-shadow: none !important;}
.noti_3 p {display:inline-block; text-decoration: none;}
.noti_3p::before{content:'' !important;}





/*나의 당첨내역보기 js css*/
/* 팝업 래퍼: 화면 가운데 정렬, 배경 투명 (딤 없음) */
.win-wrap{
  position: fixed;
  inset: 0;
  display: none;                 /* JS로 'flex'로 바꿈 */
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* 팝업 박스 (스크린샷 스타일) */
.win-box{
  background:#fafbfd;
  border-radius:6px;
  padding:16px;
  min-width:280px;
  max-width:360px;
  text-align:center;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.win-title{margin:0 0 10px; font-size:15px; font-weight:700;}
.win-panel{border:1px solid #dedfe0; padding:10px; margin-bottom:8px;border-radius: 12px;}
.win-list{list-style:none; padding:0; margin:0; font-size:14px; line-height:1.4;}
.win-note{font-size:14px; margin:8px 0 12px;}
.win-close{
  display:block; width:100%; height:40px; line-height:40px;
  background:#297fef; color:#fff; border:0; border-radius:4px; font-weight:700; cursor:pointer;
}

.quick p strong.quick_pc { display: block !important; }
.quick p strong.quick_m  { display: none !important; }



.evt_wp .quick{position: fixed; right: 10px; bottom: 35%; z-index: 10; text-align: center;}
.evt_wp .quick p{margin-top: 5px; padding: 15px; font-size: 14px; color: #fff; font-weight: 500; border-radius: 10px; background: rgba(134,1,20,0.95);}
.evt_wp .quick p strong,
.evt_wp .quick p span{display: block;}
.evt_wp .quick a:hover p{background: rgba(8,23,44, 0.82);}
.btn-apply {width: fit-content; opacity: 0.8; border-bottom: 1px solid #fff; position: relative; padding-right: 10px; margin: 5px auto 0; font-size: 11px;}
.btn-apply::after {position: absolute;right: 2px; bottom: -5px; content: ''; width: 8px; height: 8px; border-top: 1px solid #fff; transform: rotate(45deg);}
.evt_wp .quick p strong {font-size: 21px; font-weight: 800; letter-spacing: -1px;padding:0.4rem 0;}
.evt_wp .yellow {color: #fff000;}



/*복권 긁기기*/
.prize_wrap {
  width: 556px;
  height: 205px;
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  user-select: none;
  -webkit-user-select: none;
  background: #f6f6f6;
  
}
/* 밑에 드러날 결과(당첨) */
.prize {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: space-between;
  background: linear-gradient(135deg, #ffe5b4, #ffd1dc);
  color: #111;
  padding: 10px;
}

/* 각 쿠폰 칸 */
.prize .col {
  flex: 1;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  text-align: center;
  padding: 0 10px;
}

/* 왼쪽과 오른쪽 구분선 */
.prize .col.left {
  border-right: 2px dashed rgba(0, 0, 0, 0.2);
}
.prize .col.right {
  border-left: 2px dashed rgba(255, 255, 255, 0.3);
}

/* 제목 */
.prize .big {
  margin-bottom: 10px;
  font-size: 20px;
  line-height: 1.4;
  font-weight: 700;
}
/* 하단 안내 */
.prize .sub {
  font-size: 18px;
  font-weight: 700;
  background-color: #fff;
  min-height: 100px;
  overflow: hidden;
  border-radius: 8px;
  display: flex;
  align-items: center; /* 세로 가운데 */
  justify-content: center; /* 가로 가운데 */
  padding: 0 15px;
}

/* 티켓 느낌의 양쪽 둥근 절단 모양 (옵션) */
.prize.coupon-box::before,
.prize.coupon-box::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 20px;
  height: 20px;
  background: #f6f6f6;
  border-radius: 50%;
  transform: translateY(-50%);
  z-index: 2;
}
.prize.coupon-box::before {
  left: -10px;
}
.prize.coupon-box::after {
  right: -10px;
}

.sub_inner {
  display: block;
  text-align: left;
  line-height: 1.5;
}
/* 위 덮개 */
#cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 12px;
  cursor: pointer;
}


.red {
  color: red;
  font-size: 0.75rem;
}

/* 추가 */
#randomBox {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  min-height: 100px;
  padding: 14px 18px;
  background: #fff;
  border-radius: 8px;
  line-height: 1.55;
  box-sizing: border-box;
  word-break: keep-all;
  text-wrap: balance;
}
#randomBox.win {
  box-shadow: 0 0 0 3px rgba(255, 208, 0, 0.55) inset;
}
#randomBox.lose {
  opacity: 0.95;
}


@media (max-width: 870px) {
  .prize_wrap {
    width: 100%;
  }
}




@keyframes rotate-in-hor{0%{transform: rotateX(360deg); opacity: 0} 100%{transform: rotateX(0deg); opacity: 1}}


/*개인정보 수집 동의 안내*/
.pi-consent{
  background:#fff;
  border-radius:10px;
  padding:12px 14px;
  margin-top:10px;
}
/* 상단 줄: [필수] 문구 + 버튼 */
.pi-row{
  position: relative;display:flex; align-items:center; justify-content:space-between; 
}
.pi-text{ display:inline-flex; align-items:center; gap:6px; }
.pi-text .req{ color:#e60012; font-style:normal; font-weight:700; }
.terms-trigger{border-radius: 10px; padding:8px 10px; background: rgba(134,1,20,0.95); color:#fff; cursor:pointer; font-size:12px; }

/* 아래로 펼쳐지는 패널 (부드러운 트랜지션) */
.terms-panel{
  overflow:hidden;           /* 접힐 때 내용 숨김 */
  max-height:0;              /* 닫힌 높이 */
  transition:max-height .35s ease, padding-top .35s ease;
  width:100%;
  padding-top:0;             /* 열릴 때만 공간 */
  margin-top:0;
}
.pi-consent.is-open .terms-panel{
  padding-top:12px;   
}

/* 내부 말풍선 + ↑ 화살표 */
.panel-inner{
  text-align:left;
  position:relative;
  background:#fff;
  border:1px solid #dfdfdf;
  border-radius:4px;
  padding:10px 12px 14px;
  min-height: 300px;
}
.panel-inner::before{
  content:"";
  position:absolute; top:-8px; left:40px;         /* 버튼 아래로 맞추려면 left 값만 조정 */
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:8px solid #dfdfdf;                   /* 바깥 테두리 */
}
.panel-inner::after{
  content:"";
  position:absolute; top:-6px; left:41px;
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-bottom:7px solid #fff;                   /* 내부 흰색 */
}

/* 내용 스타일 */
.panel-desc{ font-size:12px; margin:0 0 8px; color:#333; }
.terms-table{ width:100%; border-collapse:collapse; font-size:12px; }
.terms-table th, .terms-table td{ border:1px solid #000; padding:6px; vertical-align:top; }
.terms-table th{ background:#f7f7f7; }
.panel-close{
  display:block; width:100%; height:36px; margin-top:10px;
  background:#000; color:#fff; border:0; border-radius:3px; font-weight:700; cursor:pointer;
}

/*자바스크립트 css*/
#piConsent .terms-trigger {margin-top: 15px; width:100%; pointer-events:auto !important; z-index:10; }








/* slide */
.evt_wp .lec_bnr{margin-left: 43.5%;}
.evt_wp .lec_bnr .swiper-container{padding-top: 0;}
.evt_wp .swiper-slide.swiper-slide{background: transparent; border-radius: 10px;}
.evt_wp .swiper-slide.swiper-slide img{border-radius: 10px;}
.evt_wp .lec_bnr .swiper-slide-active{background: transparent;}
.evt_wp .lec_bnr .swiper-slide-prev{margin-right: 35px; background: transparent;}
.evt_wp .lec_bnr .swiper-slide-next{margin-left: 35px; background: transparent;}

.evt_wp .lec_bnr .swiper-button-prev{position: absolute; left: 50%; margin-left: -615px; background: #333; border-radius: 50%; width: 50px; height: 50px;  color: #fff; font-weight: 900}
.evt_wp .lec_bnr .swiper-button-next{ position: absolute; top: 440px; left: 50%; margin-left: 600px; background: #333; border-radius: 50%; width: 50px; height: 50px; color: #fff; font-weight: 900;}    
.evt_wp .lec_bnr .swiper-button-prev::after{font-size: 18px; padding-right: 2px;}
.evt_wp .lec_bnr .swiper-button-next::after{font-size: 18px; padding-left: 2px;}

* [class^="bg_"]{position: relative; padding: 100px 0;}
.evt_wp .bg_01{background: #f4f2ec url('imgs/bg_con1.png') no-repeat 0 center;}
.evt_wp .bg_02{background: #fff url('imgs/bg_con2.png') no-repeat bottom center;}
.evt_wp .bg_03{background: #f4f2ec;}

.evt_wp .dungdung{animation:  updown 1s both infinite alternate;}
.evt_wp .blink{animation:  blink 1s infinite;}
.evt_wp .up-on-scroll{transition: transform .7s, opacity 1.7s;}

@keyframes blink{0%{opacity: 1} 50%{opacity:.2} 100%{opacity:1}}
@keyframes updown{ 0%{transform:  translateY(-5px);} 100%{transform:  translateY(5px);}}


/* PC 와이드 */
@media screen and (min-width: 1441px) {   
.evt_wp .center{width: 1200px; margin: 0 auto; text-align: right;}
.evt_wp .inner{position: relative; width: fit-content; display: inline-block;}
}

/* 모바일 */
@media screen and (max-width: 1440px) {
.quick p strong.quick_pc{
  display: none !important;
}
.quick p strong.quick_m {
  display: block !important;
}

  .panel-inner::before{ left:auto; right:22px; }
  .panel-inner::after{ left:auto; right:23px; }
  .sub_inner{
    font-size: 0.91rem;
    text-align: center;
  }
  .evt_wp .fixed_left{display: none;}  
  .evt_wp .noti{width: 100%; padding: 20px 15px; font-size: 13px;}
  
  .evt_wp .quick {position: relative; width: 100%; right: 0;}
  .evt_wp .quick p{border-radius: 0; padding: 10px 0;}
  .evt_wp .quick p strong, 
  .evt_wp .quick p span{display: inline;}
  .evt_wp .quick .btn-apply{display: none;}
  .evt_wp .quick a:hover p{background: auto;}

  .evt_wp .btm_bar > .bnr{width: 96%; margin: 0 auto; padding: 0;}
  .evt_wp .btm_bar > .bnr li{padding: 10px 0 6px 32px; border-radius: 10px 10px 0 0; font-size: 18px; width: 49%; text-align: left;}
  .evt_wp .btm_bar .bnr li::after{top: 15px; right: 22px; width: 8px; height: 8px;}
  
  .evt_wp .visual{margin-top: -5%; padding-bottom: 5%;}
  .evt_wp .visual_typo{width: 10%; bottom: 15%;}
  .evt_wp .visual_txt{width: 14%; top: 5%; left: 5%;}  

  .evt_wp .lec_bnr{margin-left: -20%; width: 130%;}
  .evt_wp .lec_bnr .swiper-container{padding-top: 0;}
  .evt_wp .swiper-slide.swiper-slide{background: #fff; border-radius: 10px;}
  .evt_wp .swiper-slide.swiper-slide img{border-radius: 10px;}
  .evt_wp .lec_bnr .swiper-slide-active{background: #fff;}
  .evt_wp .lec_bnr .swiper-slide-prev{margin-right: 3%; background: #fff; opacity: 0.6;}
  .evt_wp .lec_bnr .swiper-slide-next{margin-left: 3%; background: #fff; opacity: 0.6;}

  .evt_wp .inner{width: 95%; position: relative;}
  .evt_wp [class^="bg_"] .tit{margin: 0 auto; font-size: 20px; padding-bottom: 5%;}
  * [class^="bg_"]{position: relative; padding: 10% 0;}

  .evt_wp .content_box{width: 100%; margin: 0 auto; padding: 0 4% 4%; }


/* 크기/레이어 기본값 유지 */
.ticket_bx{
  position: relative;
  width: 100%;
  max-width: 730px;     /* 필요 시 조정 */
  margin: 0 auto;
  /* height: 300px;  <= 이 고정 높이 제거! (찌그러짐 원인) */
}
.ticket_bx canvas,
.ticket_bx .result-box{
  position: absolute; inset: 0; width: 100%; height: 100%;
}

.agree-wrap {
  flex-direction: column;   /* 세로 배치 */
  align-items: flex-start;  /* 왼쪽 정렬 */
}
.agree-wrap .terms-trigger {
  margin-top: 6px;          /* 위 체크박스랑 간격 */
}



  .evt_wp .ticket_bx{width: 100% !important; }  
  .scratchCanvas{display: none;}
  .evt_wp .ticket{display: block;}
  .evt_wp .object{display: none;} 

  /*동의함 위치*/
  .agree-ctrl{bottom:5%;font-size:0.75rem;display:flex;align-items: center;}
  /*약관보기 모바일*/
   .pi-row{font-size:0.875rem;}

}