/* 공통 */
.wrap {width:100%; min-height:100vh; position:relative; background: rgb(65, 65, 66); min-width:320px; overflow-x:hidden;}

header {position:absolute; top:0; left:50%; transform:translateX(-50%); width:100%; max-width:640px; min-width:320px; z-index:2; }
header .slogan-ico { position:absolute; top:24px; left:24px; width:38px; z-index:2;}
header .header-logo { position:absolute; top:30px; left:50%; transform:translateX(-50%); z-index:2; width:139px;}
header .slogan-ico img,
header .header-logo img {width:100%;}

.terms {width:100%; background:#4E4E4E; }
.terms * { font-family: "NotoSansCJK" , sans-serif; }
.terms .terms_inner {width:100%; max-width: 640px; padding:40px 20px 54px; margin:0 auto;  }
.terms .terms_inner .term + .term {margin-top:45px;}
.terms .terms_inner p.ti { color:#fff; font-size:17px; margin-bottom:10px; font-weight:500; }
.terms .terms_inner ul {width:100%;}
.terms .terms_inner ul *  {  }
.terms .terms_inner ul li { color:#fff; margin-bottom:5px; padding-left:8px; text-indent:-8px; font-size:14px; line-height:1.7; letter-spacing:-0.024rem; word-spacing:-0.024rem; text-align:left; word-break:keep-all; }
.terms .terms_inner ul li b {color:#fff; font-weight:400;}

footer {width:100%; background:#EFEBE7; }
footer * { font-family: "NotoSansCJK" , sans-serif; }
footer .footer_inner {width:100%; max-width:414px; margin:0 auto; padding:40px 0 60px; }
footer .footer_inner .footer-logo {width:100%; max-width: 276px; margin:0 auto 20px;}
footer .footer_inner .footer-logo img {width:100%;}
footer .footer_info ul.footer_info_list {}
footer .footer_info ul.footer_info_list li {display:flex; align-items:center; justify-content:center;}
footer .footer_info ul.footer_info_list li + li {margin-top:5px;}
footer .footer_info ul.footer_info_list li p {display:block; font-size:13px; color:#000; letter-spacing: -0.024rem; padding:0 5px;}
footer .footer_info ul.footer_info_list li > span {font-size: 9px; color: #000;}

.modal {position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:999; }
.modal .bg {width:100%; height:100vh; background:rgba(10, 10, 10, 0.50); }
.modal .btn_close .btn { max-width: 170px; box-shadow: none;}
.modal .btn_close .btn > span {color: #FEFEFE;}
.modal .modal_inner {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; max-width:355px; background:#fff; border-radius:20px; text-align: center; padding: 62px 20px 30px;}
.modal .modal_inner:has( .modal_txt > span) {padding-top: 38px;}
.modal .modal_inner .modal_txt { margin-bottom: 30px; font-size: 20px; text-align: center; color: #161616; line-height: 1.5; letter-spacing: -0.024rem; font-weight: 700; word-break: keep-all; }
.modal .modal_inner .modal_txt span { color: #1D1D1C; font-size: 17px; font-weight: 500; line-height: 150%; letter-spacing: -0.34px; }
.modal .modal_inner .modal_txt p { margin-top: 13px; color: #1D1D1C; text-align: center; font-size: 18px; font-weight: 700; line-height: 150%; letter-spacing: -0.36px; }

.btn { display: block; width: 100%; max-width: 209px; height: 50px; margin: 0 auto; padding: 13px 0px; cursor: pointer; text-align: center; border-radius: 10px; background: #ECBD66; box-shadow: 2px 3px 6px 0 rgba(0, 0, 0, 0.35); }
.btn > span { color: #1D1D1C; font-size: 20px; font-weight: 700; line-height: 1.4; letter-spacing: -0.02em; }

.br_400 {display: none;}


/* KV */
.content { max-width: 768px; margin: 0 auto; background: url(/img/bg_main_full.jpg) no-repeat center top / 768px; padding-bottom: 54px;}
.content .visual { position: relative; width: 100%; min-width: 365px; max-width: 460px; margin: 0 auto; padding-top: 42px; min-height: 545px;}
.content .visual .tag {position: absolute; left: 100%; transform: translateX(-100%); bottom: -8px; width: 100%; max-width: 182px;}
.content .visual .tag > img {width: 100%;}
.content .visual .rewards {position: absolute; left: 25px; bottom: 0px; width: 100%; max-width: 208px;}
.content .visual .rewards > img {width: 100%;}
.content .visual > .logo { width: 100%; max-width: 235px; margin: 0 auto;}
.content .visual > .logo > img {width: 100%;}
.content .visual > .tit_img { width: 100%; max-width: 355px;  margin: 0 auto; margin-top: 25px;}
.content .visual > .tit_img > img {width: 100%;}


@media screen and (max-width:400px) {
    .content .visual {left: 50%; transform: translateX(-50%);}
    .content .visual .rewards {left: 10px;}
    .content .visual .tag {max-width: 152px; bottom: 0;}
    
}





/* 메인페이지 */
.content.main {padding-bottom: 0;}
.main .birth_chk {width: 100%; margin:0 auto; padding-top: 28px;}
.main .birth_chk .birth_chk_ti > p { margin-bottom: 18px; text-align: center; color: #000; letter-spacing: -0.01em; font-size: 22px; font-weight: 700; text-shadow: -1.5px -1.5px 0 #EFEBE7, 1.5px -1.5px 0 #EFEBE7, -1.5px 1.5px 0 #EFEBE7, 1.5px 1.5px 0 #EFEBE7; }
.main .birth_chk ul.input_wrap { display: flex; align-items: center; justify-content: space-between; gap: 15px; width: 100%; max-width: 414px; margin: 0 auto; padding: 0 24px; margin-bottom: 30px; }
.main .birth_chk ul.input_wrap li {width:100%;}
.main .birth_chk ul.input_wrap li input { width: 100%; height: 51px; padding-top: 2px; border: 2px solid #EBBA60; border-radius: 10px; background: #FFF; text-align: center; color: #141414; font-family: "Gmarket Sans TTF" , sans-serif; font-size: 18px; font-weight: 700; }
.main .birth_chk ul.input_wrap li input::placeholder { color:#B9B9B9; font-weight:700; }

.main .birth_chk .birth_chk_desc { display: flex; align-items: center; justify-content: center; width: 100%; padding: 15px 3px; margin: 0 auto; margin-bottom: 30px; background: rgba(255, 255, 255, 0.60); font-size: 15px; font-weight: 500; line-height: 1.4; word-spacing: -0.05rem; }
.main .birth_chk .birth_chk_desc > p { color: #001415; font-size: 14px; font-weight: 500; padding-top: 2px; letter-spacing: -0.03em;}
.main .birth_chk .birth_chk_desc em {width:24px; display:inline-block; margin-right:5px;}
.main .birth_chk .birth_chk_desc em img {width:100%;}
.main .btn_apply_wrap {width:100%;}

@media screen and (max-width: 500px){
	.content .visual .rewards {left: 15px;}
	.content .visual .tag { max-width: 175px;}
}

@media screen and (max-width: 375px) {
    .main .birth_chk .birth_chk_desc > p {font-size: 13px;}
    .main .birth_chk .birth_chk_desc em {width:20px; margin-right:3px;}
}

.content .sub_link_list {width: calc(100% - 40px); max-width: 414px; margin: 0 auto; margin-top: 40px; }
.content .sub_link_list > li { width: fit-content; max-width: 345px; margin: 0 auto; border-radius: 8px; border-bottom: 1px solid #FFF; background: #545455; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.04); }
.content .sub_link_list > li + li {margin-top: 20px;}
.content .sub_link_list > li a { display: flex; align-items: center; min-width: 137px; padding: 10px 20px; }
.content .sub_link_list > li a span { display: inline-block; margin-right: 12px; padding-top: 3px; width: 95%; word-break: keep-all; text-align: center; color: #FFF; font-size: 16px; font-weight: 500; line-height: 150%; letter-spacing: -0.32px; }
.content .sub_link_list > li em {display: inline-block; width: 17px; height: 15px; background: url(/img/icon_link.png) no-repeat 100% / contain;}
.content .sub_link_list > li em.talk { margin-left: -6px; width: 18px; height: 18px; aspect-ratio: 1; background: url(/img/icon_talk.svg) no-repeat center/ cover;}

@media screen and (max-width: 385px) {
    .content .sub_link_list > li a {padding: 10px 15px;}
    .content .sub_link_list > li a span {margin-right: 8px; font-size: 15px;}
}

.content .gift_wrap { margin-top: 30px; text-align: center;}
.content .gift_wrap > p { color: #FFF; font-weight: 500; line-height: 150%; letter-spacing: -0.48px; }
.content .gift_wrap > p > span { color: #FFF; font-weight: 700; line-height: 150%; letter-spacing: -0.48px;}
.content .gift_wrap > .ti { font-size: 19px; letter-spacing: -0.57px;}
.content .gift_wrap > .desc { font-size: 16px; }
.content .gift_wrap > .desc + .desc {margin-top: 7px;}
.content .gift_wrap > .img_box {width: 100%; margin-top: 30px;}
.content .gift_wrap > .img_box > img {width: 100%;}



/* 쿠폰입력 */
.content.coupon {padding-bottom: 0;}
.coupon .cp_check {width: calc(100% - 40px); margin: 0 auto; padding-top: 32px; max-width: 414px; text-align: center;}
.coupon .cp_check > p { margin-bottom: 6px; color: #000; font-size: 22px; font-weight: 700; line-height: 140%; letter-spacing: -0.01em; text-shadow: -1.5px -1.5px 0 #EFEBE7, 1.5px -1.5px 0 #EFEBE7, -1.5px 1.5px 0 #EFEBE7, 1.5px 1.5px 0 #EFEBE7; }
.coupon .cp_check .cp_img { width: 100%; max-width:258px; margin: 0 auto; margin-bottom: 30px;}
.coupon .cp_check .cp_img > img {width: 100%;}
.coupon .cp_check .input_wrap { margin-bottom: 25px;}
.coupon .cp_check .input_wrap input { width: 100%; height: 51px; padding: 0 15px; padding-top: 2px; font-size: 20px; font-weight: 500; color: #161616; text-align: center; border-radius: 10px; border: 2px solid #EBBA60; background: #FFF; }
.coupon .cp_check .input_wrap input::placeholder { color: #B9B9B9; font-size: 18px; font-weight: 700; letter-spacing: -0.36px; }




/* 당첨 페이지 */
.content.winner { padding-bottom: 0; background: url(/img/bg_content_full.jpg?ver=2025) no-repeat center top / 768px; }
.content.winner .visual {padding-bottom: 0; min-height: 250px;}
.content.winner .reward_visual .txt_img {width: 100%; max-width: 307px; margin: 0 auto;}
.content.winner .reward_visual .txt_img > img {width: 100%;}

.content.winner .reward_visual .item {position: relative; width: 100%; height: 200px; margin-bottom: 35px; margin-top: 10px;}
.content.winner .reward_visual .item_img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 100%; max-width: 300px; margin: 0 auto; z-index: 2;}
.content.winner .reward_visual .bg_circle { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100%; aspect-ratio: 1; border-radius: 50%; background-color: rgba(255, 255, 255, 0.43); filter: blur(12.539999961853027px); z-index: 1; }

.content.winner .reward_visual.first .item {margin-top: 17px;}
.content.winner .reward_visual.first .item_img {max-width: 271px; left: calc(50% - 17px);}
.content.winner .reward_visual.first .bg_circle {display: none;}


.content.winner .user_info { width: calc(100% - 40px); max-width: 414px; margin: 0 auto;}
.content.winner .user_info > .ti { margin-bottom: 19px; text-align: center; color: #000; font-size: 22px; font-weight: 700; line-height: 140%; letter-spacing: -0.01em; text-shadow: -1.5px -1.5px 0 #EFEBE7, 1.5px -1.5px 0 #EFEBE7, -1.5px 1.5px 0 #EFEBE7, 1.5px 1.5px 0 #EFEBE7; }
.content.winner .user_info > .btn { margin-top: 39px; }
.content.winner .user_info .info {}
.content.winner .user_info .info > .ti { margin-bottom: 8px; color: #1D1D1C; font-size: 18px; font-weight: 700; line-height: normal; }
.content.winner .user_info .info > .ti.wh {color: #fff;}
.content.winner .user_info .info + .info {margin-top: 17px;}

.content.winner .input_wrap {display:flex; align-items:center; justify-content:space-between; gap:15px; width: 100%;}
.content.winner .input_wrap li {width:100%;}
.content.winner .input_wrap select { padding: 0 20px; width: 100%; height: 51px; padding-top: 3px; text-align: left; background: url(/img/select_btn.svg) no-repeat right 15px center; background-color: #fff; border-radius: 10px; border: 2px solid #EBBA60; font-size: 20px; font-weight: 700; color: #414142; }
.content.winner .input_wrap option {font-weight: 500;}
.content.winner .input_wrap input { width: 100%; height: 51px; padding: 0 15px; padding-top: 2px; border-radius: 10px; border: 2px solid #EBBA60; background: #FFF; text-align: center; font-size: 20px; font-weight: 700; color: #161616; }
.content.winner .input_wrap input::placeholder { color: #B9B9B9; font-size: 18px; font-weight: 700; letter-spacing: -0.36px; }

.content.winner .user_info > .desc { margin-top: 39px; word-break: keep-all; color: #FFF; text-align: center; font-size: 14px; font-weight: 500; line-height: 150%; }

.content.winner .gift_wrap {margin-top: 60px;}

@media screen and (max-width: 413px){
    .content.winner .user_info > .desc > .br_n {display: none;}
    .br_400 {display: block;}
}

.content.fin { height: 100dvh; min-height: 950px;}
.content.fin .visual {padding-bottom: 0; min-height: 250px; margin-bottom: 5px;}
.content.fin .visual > .tit_img {margin-top: 0;}
.content.fin > .txt_box { width: calc(100% - 30px); max-width: 340px; margin: 0 auto; margin-top: 137px; margin-bottom: 29px; border-radius: 20px; border: 2px solid #ECBD66; background: #F9F8F0; }
.content.fin > .txt_box > p { padding: 54px 0; padding-top: 56px; color: #1D1D1C; text-align: center; font-size: 24px; font-weight: 700; line-height: 150%; letter-spacing: -0.48px; }

.content.fin > .desc_box { width: calc(100% - 40px); max-width: 414px; margin: 0 auto; padding-top: 35px; padding-bottom: 40px; text-align: center; }
.content.fin > .desc_box .desc1 { margin: 0 auto; word-break: keep-all; color: #FFF; font-size: 17px; font-weight: 500; line-height: 140%; letter-spacing: -0.02em; }
.content.fin > .desc_box .desc2 { margin: 0 auto; margin-top: 34px; word-break: keep-all; font-size: 14px; line-height: 1.5; color: #FFF; font-weight: 500; letter-spacing: -0.02em;}



@media screen and (max-width: 400px) {
    .content.fin > .desc_box  {width: calc(100% - 15px);}
    .content.fin > .desc_box .desc1 {font-size: 16px;}
    .content.fin > .desc_box .desc2 {font-size: 14px;}
}
@media screen and (max-width: 374px) {
    .content.fin > .desc_box  {width: calc(100% - 5px);}
    .content.fin > .desc_box .desc1 {font-size: 15px;}
    .content.fin > .desc_box .desc2 {font-size: 13px;}
}


/* 문의하기 팝업 */
body:has(.popup.on) {overflow: hidden;}
.popup { position: fixed; top: 0; left: 0; width: 0; height: 0; overflow: hidden; z-index: 29; }
.popup .bg { opacity: 0; visibility: hidden; transition: opacity .3s; pointer-events: none; position: fixed; top: 0; left: 0; width: 100%; height: 100dvh; background: #00000080; }
.popup .inner { position: fixed; opacity: 0; visibility: hidden; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 30px); max-width: 380px; transition: opacity .3s; padding: 35px 20px; border-radius: 15px; background: #fff; }
.popup .inner .btn_close { position: absolute; top: 13px; right: 12px; width: 32px; height: 32px; background: url(/img/icon_popClose.svg) no-repeat center/ cover; }
.popup .inner .bottom_btn { display: block; width: 100%; padding: 14px 0; max-height: 50px; margin: 0 auto; border-radius: 10px; text-align: center; font-size: 20px; font-weight: 700; letter-spacing: -0.4px; }

.popup .inner > .top { text-align: center; }
.popup .inner > .top .title { margin-bottom: 15px; color: #FFF; font-size: 22px; font-weight: 700; line-height: 150%; letter-spacing: -0.44px; }
.popup .inner > .top .desc { color: #FFF; font-size: 16px; font-weight: 500; line-height: 150%; letter-spacing: -0.32px; }
.popup.on .bg { opacity: 1; visibility: visible; pointer-events: all; transition: opacity .3s;}
.popup.on .inner { opacity: 1; visibility: visible; }


.popup.contect .inner { padding: 35px 20px 45px; background: #414142; }
.popup.contect .user_info .info {margin-top: 25px;}
.popup.contect .user_info .info > .ti { margin-bottom: 8px; color: #1D1D1C; font-size: 18px; font-weight: 700; line-height: normal; }
.popup.contect .user_info .info > .ti.wh {color: #fff;}
.popup.contect .user_info .info + .info {margin-top: 17px;}
.popup.contect .input_wrap {display:flex; align-items:center; justify-content:space-between; gap:15px; width: 100%;}
.popup.contect .input_wrap li {width:100%;}
.popup.contect .input_wrap select { padding: 0 15px; width: 100%; height: 51px; padding-top: 3px; text-align: left; background: url(/img/select_btn.svg) no-repeat right 15px center; background-color: #fff; border-radius: 10px; border: 2px solid #EBBA60; font-size: 16px; font-weight: 700; color: #161616; }
.popup.contect .input_wrap option {font-weight: 500;}
.popup.contect .input_wrap input { width: 100%; height: 51px; padding: 0 15px; padding-top: 2px; border-radius: 10px; border: 2px solid #EBBA60; background: #FFF; text-align: center; font-size: 16px; font-weight: 700; color: #161616; }
.popup.contect .input_wrap input::placeholder { color: #797979; font-size: 16px; font-weight: 500; letter-spacing: -0.36px; }

.popup.contect .input_wrap textarea { width: 100%; height: auto; min-height: 100px; resize: none; margin-top: 13px; padding: 8px 15px; border-radius: 10px; border: 2px solid #EBBA60; background: #FFF; text-align: left; font-size: 15px; font-weight: 500; color: #161616; line-height: 150%; letter-spacing: -0.3px;}
.popup.contect .input_wrap textarea::placeholder {color: #797979;}

.popup.contect .bottom_btn { max-width: 180px; margin-top: 20px; background: #EABA60; color: #1D1D1C; }


.popup.submit .inner {padding: 65px 10px 33px;} 
.popup.submit .inner > p { margin-bottom: 38px; color: #161616; text-align: center; font-size: 20px; font-weight: 700; letter-spacing: -0.4px; }
.popup.submit .inner .bottom_btn { max-width: 180px; background: #EABA60; color: #FEFEFE; }

@media screen and (max-width: 380px) {
    .popup .inner > .top .desc {font-size: 14px;}
}