/* 공통 */ .wrap {width:100%; min-height:100vh; position:relative; background: rgb(65, 65, 66); min-width:320px; overflow-x:hidden;} .no-scroll { overflow: hidden; height: 100%; } 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: 302px; 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: 32px; } .content .visual .logo {max-width:255px; margin:0 auto;} .content .visual .tag {position: absolute; left: 100%; transform: translateX(-100%); bottom: 92px; width: 100%; max-width: 182px;} .content .visual .tag > img {width: 100%;} .content .visual .rewards_01 {position: absolute; left: 25px; bottom: 100px; } .content .visual .rewards {position: absolute; left: 50%; bottom: 0px; width: 100%; transform:translateX(-50%); max-width: calc(100% - 40px); display:flex; align-items:center; justify-content:center;} .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%;} .content .visual .rewards_01 {left:15px; width:56%;} .content .visual .rewards_01 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;} .content.main .visual {min-height: 640px;} .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%;} /************ 내용추가 2026-06-20 **************/ .main .evt_date { text-align:center; margin:26px auto 42px;} .main .evt_date b { display:block; font-family: "Gmarket Sans TTF" , sans-serif; color: #4B4B4B; font-size: 24px; font-weight: 700; margin-bottom:8px;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, 0px -1.5px 0 #EFEBE7, 0px 1.5px 0 #EFEBE7, -1.5px 0px 0 #EFEBE7, 1.5px 0px 0 #EFEBE7;} .main .evt_date p.desc {font-family: "Gmarket Sans TTF" , sans-serif; color: #FFF; font-size: 14px; font-weight: 500; letter-spacing: -0.14px;} @media screen and (max-width: 500px){ /*.content .visual .rewards {left: 15px;}*/ .content .visual .tag { max-width: 35%;} .content .visual .tag img {width:100%;} } @media screen and (max-width: 413px) { .content .visual .rewards {max-width:calc(100% - 30px);} } @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; margin-bottom:80px; } .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.store { margin-left: 0; width: 18px; height: 18px; aspect-ratio: 1; background: url(/img/ico_store.svg) no-repeat center/ cover;} .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.select {background-position-y:-17px;} .content.select .select_ti p.ti {color:#000; text-align: center; /*-webkit-text-stroke-width: 2px; -webkit-text-stroke-color: #EFEBE7;*/ font-size:26px; font-weight:700; letter-spacing:-0.025rem; margin-top:54px; margin-bottom:35px; text-shadow: -2px -2px 0 #EFEBE7, 2px -2px 0 #EFEBE7, -2px 2px 0 #EFEBE7, 2px 2px 0 #EFEBE7;} .content.select .select_ti p.ti b{ position:relative; display:inline-block; color:#ECBD66; font-weight:700; font-size:30px; padding-right:3px; text-shadow: -2px -2px 0 #000000, 2px -2px 0 #000000, -2px 2px 0 #000000, 2px 2px 0 #000000;} .content.select .select_ti p.ti b:after {content:""; display:block; position:absolute; width:68px; height:8px; left:-4px; bottom:-5px; background:url(/img/select_ti_underline.svg) no-repeat; background-size:cover;} .content.select .select_type {} .content.select .select_type ul {display:flex; align-items:flex-start; gap:10px; width:calc(100% - 60px); margin:0 auto 71px; } .content.select .select_type ul li {width:100%;} .content.select .select_type ul li a {display:block; box-shadow: 0 0 9.421px 0 rgba(0, 0, 0, 0.25); border-radius:10px; overflow:hidden;} .content.select .select_type ul li .btn_img { background: linear-gradient(0deg, #3C3C3C -10.97%, #7D7D7D 100%); } .content.select .select_type ul li .btn_img img {width:100%;} .content.select .select_type ul li .btn_ti { background:#fff; font-size:20px; font-weight:700; color:#000; letter-spacing:-0.025rem; text-align:center; padding: 16px 0 ;} .content.select .select_type ul li a:active .btn_ti {background:#ECBD66; color:#fff;} .content.select .select_type ul li .selt_desc {width:100%; padding-top:18px; } .content.select .select_type ul li .selt_desc p { font-family: "NotoSansCJK", sans-serif; text-align:center; color: #000; text-align: center; font-size: 14px; font-weight: 400; line-height: 160%; letter-spacing: -0.35px; text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;} .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: 47px; max-width: 414px; text-align: center; padding-bottom:140px;} .coupon .cp_check > p { margin-bottom: 15px; color: #000; font-size: 26px; 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 p.input_ti {font-size:18px; color:#000; font-weight:700; letter-spacing:-0.025rem; margin-bottom:14px;} .coupon .cp_check .input_wrap ul.inputs {display:flex; gap:2px; align-items:center;} .coupon .cp_check .input_wrap ul.inputs li {} .coupon .cp_check .input_wrap ul.inputs li.dash { display:block; width:20px; height:3px; border-radius:3px; background:#ECBD66; } .coupon .cp_check .input_wrap input { width: 100%; height: 51px; padding: 0 2px; padding-top: 2px; font-size: 20px; font-weight: 700; line-height:51px; 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.receipt {padding-bottom: 0;} .receipt .rc_check {width: calc(100% - 40px); margin: 0 auto; padding-top: 47px; max-width: 414px; text-align: center; padding-bottom:80px;} .receipt .rc_check > p { margin-bottom: 23px; color: #000; font-size: 26px; 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; } .receipt .rc_check .rc_noti {display:flex; width:100%; justify-content: center; align-items: center; padding:15px 0; border-radius: 10px; border: 3px solid #ECBD66; background: rgba(255, 255, 255, 0.90); margin-bottom:14px;} .receipt .rc_check .rc_noti p.ti {font-size:16px; color:#000; font-weight:700; line-height:1.4; margin-bottom:10px; letter-spacing:-0.05rem;} .receipt .rc_check .rc_noti p.txt {font-size:14px; color:#000; font-weight:500; line-height:1.5; letter-spacing:-0.05rem; } .receipt .rc_check .rc_img {width:100%; max-width:260px; margin:0 auto;} .receipt .rc_check .rc_img img {width:100%;} .receipt .rc_check .btn.upload {max-width:310px; display:flex; align-items:center; justify-content:center;} .receipt .rc_check .btn.upload em {margin-right:5px;} .receipt .rc_check .btn.upload span {padding-top:4px;} .receipt .rc_check .rc_upload_img {width:100%; max-width:260px; margin:0 auto 34px; padding-top:20px;} .receipt .rc_check .rc_upload_img .rc_upload_inner {position:relative; width:100%; } .receipt .rc_check .rc_upload_img .rc_upload_inner::after {display:block; content:""; position:absolute; width:45px; height:38px; top:-20px; right:-35px; background:url(/img/rc_upload_img_tr.svg) no-repeat; background-size:cover;} .receipt .rc_check .rc_upload_img .rc_upload_inner::before {display:block; content:""; position:absolute; width:26px; height:23px; bottom:-10px; left:-25px; background:url(/img/rc_upload_img_bl.svg) no-repeat; background-size:cover;} .receipt .rc_check .rc_upload_img .rc_upload_inner img {width:100%;} .receipt .rc_check .rc_upload_img .rc_upload_inner .rc_upload_img_top { position:absolute; top:-2px; left:0; width:calc(100% + 2px); height:7px; background:url(/img/rc_upload_img_top.svg) no-repeat; background-size:cover;} .receipt .rc_check .rc_upload_img .rc_upload_inner .rc_upload_img_bott { position:absolute; bottom:-2px; left:0;width:calc(100% + 2px); height:7px; background:url(/img/rc_upload_img_bott.svg) no-repeat; background-size:cover;} .receipt .rc_check .rc_upload_img .rc_upload_inner .rc_upload_img_left {position:absolute; top:-2px; left:-2px; width:5px; height:calc(100% + 4px); background:url(/img/rc_upload_img_left.svg) no-repeat; background-size:cover;} .receipt .rc_check .rc_upload_img .rc_upload_inner .rc_upload_img_right {position:absolute; top:-2px; right:-2px; width:5px; height:calc(100% + 4px); background:url(/img/rc_upload_img_right.svg) no-repeat; background-size:cover;} .receipt .rc_check .btn_rc_img_reupload {margin-top:22px; margin-bottom:30px;} .receipt .rc_check .btn_rc_img_reupload a {display:inline-block; font-size:16px; font-weight:700; letter-spacing:-0.05rem; color:#fff; border-bottom:solid 2px #fff; padding: 0 3px 5px 1px; } .receipt .rc_check .btn_rc_img_reupload a em {margin-right:5px;} .receipt .rc_check .rc_reupload_noti p {font-size: 14px; font-weight:500; line-height:1.6; letter-spacing:-0.025rem; color:#fff;} /* 당첨 페이지 */ .content.winner { padding-bottom: 0; background: url(/img/bg_content_full.jpg?ver=2025) no-repeat center top / 768px; background-position-y:-15px; } .content.winner .visual {padding-bottom: 0; min-height: 250px;} .content.winner .reward_visual {padding-top:20px;} .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-top: 20px; margin-bottom:15px;} .content.winner .reward_visual .item_img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 100%; max-width: 270px; 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; margin-bottom:15px;} .content.winner .reward_visual.first .item_img {max-width: 300px; left: calc(50% - 17px);} .content.winner .reward_visual.first .bg_circle {display: none;} .content.winner .reward_visual.second .item_img {max-width: 350px; } .content.winner .reward_02_cap_info {width:100%; max-width:300px; margin:0 auto 30px; padding-top:10px;} .content.winner .reward_02_cap_info .cap_img {width:100%; } .content.winner .reward_02_cap_info .cap_img img {width:100%;} .content.winner .reward_02_cap_info .cap_txt { } .content.winner .reward_02_cap_info .cap_txt p {font-size:16px; font-weight:500; line-height:1.5; letter-spacing:-0.05rem; text-align:center; color:#ECBD66;} .content.winner .reward_02_cap_info .cap_txt b {font-weight:700; color:#ECBD66;} .content.winner .reward_02_cap_info .cap_txt b.bolder {font-size: 25px; font-weight:700;} .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: 24px; 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; line-height:47px; padding-top: 2px; 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; line-height:47px; 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 .input_wrap input.addr {font-size:18px; font-weight:500;} .content.winner .user_info .info ul.terms_list {padding-top:20px;} .content.winner .user_info .info ul.terms_list li {} .content.winner .user_info .info ul.terms_list li + li {margin-top:10px;} .content.winner .user_info .info ul.terms_list li .custom-checkbox { display: inline-flex; align-items: center; cursor: pointer; user-select: none; } .content.winner .user_info .info ul.terms_list li .custom-checkbox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .content.winner .user_info .info ul.terms_list li .checkbox-box { width: 24px; height: 24px; border: 1px solid #ECBD66; border-radius: 5px; margin-right: 8px; display: inline-block; position: relative; transition: all 0.2s ease; background-color: #414142; } .content.winner .user_info .info ul.terms_list li .custom-checkbox input:checked ~ .checkbox-box { background-color: #ECBD66; border-color: #ECBD66; } .content.winner .user_info .info ul.terms_list li .checkbox-text {font-size:15px; font-weight:500; letter-spacing:-0.05rem; color:#fff;} .content.winner .user_info .info ul.terms_list li .checkbox-box::after { content: ""; position: absolute; display: none; left: 8px; top: 3px; width: 6px; height: 12px; border: solid #414142; border-width: 0 2px 2px 0; transform: rotate(45deg); } .content.winner .user_info .info ul.terms_list li .custom-checkbox input:checked ~ .checkbox-box::after { display: block; } .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%; padding-bottom:75px;} .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 {min-height: 950px; background-position-y:-10px;} .content.fin.fin_second {background-position-y:70px; background-color:#EFEBE7;} .content.fin .visual {padding-bottom: 0; min-height: 250px; margin-bottom: 5px;} .content.fin .visual > .tit_img {margin-top: 25px;} .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: 80px; 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;} .content.fin .second_ti {color: #1D1D1C; text-align: center; font-size: 24px; font-weight: 700; line-height: 150%; letter-spacing: -0.48px; padding-top:10px; line-height:1.4;} .content.fin .second_box { width: calc(100% - 30px); max-width: 340px; margin: 62px auto 29px; border-radius: 20px; border: 2px solid #ECBD66; background: #F9F8F0; padding:15px 0 40px; } .content.fin .second_box .cap_img {} .content.fin .second_box .cap_img img {width:100%; } .content.fin .second_box .cap_txt p {font-size:16px; font-weight:500; line-height:1.5; letter-spacing:-0.05rem; text-align:center; color:#1D1D1C;} .content.fin .second_box .cap_txt b {font-weight:700; color:#1D1D1C;} .content.fin .second_box .cap_txt b.bolder {font-size: 25px; font-weight:700;} @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: 24px; height: 24px; 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; } /*.popup.on .inner { padding: 24px 10px 50px; text-align: center; border: 3px solid #EABA60;} .popup.on .inner .logo {width: 100%; max-width: 154px;} .popup.on .inner > p {padding-top: 22px; color: #161616; font-size: 25px; font-weight: 700; line-height: 130%; letter-spacing: -0.5px;} .popup.on .inner > p span { display: inline-block; padding-top: 12px; color: #000; font-size: 20px; font-weight: 500; }*/ @media screen and (max-width: 380px) { .popup .inner > .top .desc {font-size: 14px;} } /* 팝업 */ .pop_evt_place {position:fixed; top:0; left:0; width:100%; height:100vh; z-index:1003; display:none;} .pop_evt_place .bg { width:100%; height:100%; background:rgba(0,0,0,.6); } .pop_evt_place .pop_inner { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:calc(100% - 40px); max-width:382px; height:calc(100vh - 120px); background:#414142; border-radius:15px; padding:25px 14px 42px ; } .pop_evt_place .pop_inner .btn_close {position:absolute; width:24px; height:24px; top:17px; right:12px; } .pop_evt_place .pop_inner .btn_close a {display:block; width:100%; height:100%; background:#fff; background: url(/img/icon_popClose.svg) no-repeat center / cover; cursor:pointer;} .pop_evt_place .pop_inner .pop_ti { font-size:22px; text-align:center; color:#fff; font-weight:700; letter-spacing: -0.44px; margin-bottom:17px;} .pop_evt_place .pop_inner .cont_list { text-align:center; overflow-y:auto; height:calc(100vh - 187px); padding-top:20px; padding-bottom:30px; } .pop_evt_place .pop_inner .cont_list li { } .pop_evt_place .pop_inner .cont_list li + li {margin-top:35px;} .pop_evt_place .pop_inner .cont_list li .list_ti { margin-bottom:15px; } .pop_evt_place .pop_inner .cont_list li .list_ti b { font-size:24px; font-weight:700; letter-spacing: -0.48px; color:#fff; display:block; margin-bottom:5px;} .pop_evt_place .pop_inner .cont_list li .list_ti span { font-size:16px; font-weight:500; letter-spacing: -0.32px; color:#fff; } .pop_evt_place .pop_inner .cont_list li .list_inner { padding:38px 5px; border-radius: 10px; background: #363636; } .pop_evt_place .pop_inner .cont_list li .list_inner .item { } .pop_evt_place .pop_inner .cont_list li .list_inner .item + .item {margin-top:33px;} .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img { margin-bottom:12px;} .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img img { width:auto; max-width:100%; height:100%; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0101 { height:84px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0102 { height:143px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0201 { height:100px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0202 { height:155px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0301 { height:98px; margin-bottom:20px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0302 { height:165px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_img.img0401 { height:145px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_ti {} .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_ti b {display:block; font-size:18px; font-weight:700; letter-spacing: -0.36px; color:#fff; margin-bottom:7px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_ti span.type { display:block; font-size:16px; font-weight:500; letter-spacing: -0.32px; color: #ECBD66; margin-bottom:10px; } .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_ti span.desc { display:block; font-size:13px; line-height:1.6; letter-spacing: -0.26px; color: #DBDBDB;} .pop_evt_place .pop_inner .cont_list li .item-app {position:relative; width:100%; margin-top:32px; padding-top:25px; margin-bottom:5px; } .pop_evt_place .pop_inner .cont_list li .item-app::after {position:absolute; display:block; content:""; background: #606060; width:calc(100% - 112px); height:1px; left:50%; top:0; transform:translateX(-50%); } .pop_evt_place .pop_inner .cont_list li .item-app .item-app-ti { display:inline-flex; align-items:center; justify-content:center; margin-bottom:21px; gap:5px;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app-ti em {display:inline-block; width:67px;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app-ti em img {width:100%; } .pop_evt_place .pop_inner .cont_list li .item-app .item-app-ti p { text-align:center; color: #FFF; font-family: "Gmarket Sans TTF"; font-size: 15px; font-weight: 700; letter-spacing: -0.295px; padding-top:5px;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont {/*display:flex; align-items:center; justify-content:center;*/ padding:0 10px; /*gap:8px;*/ } .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont .btn_app {display:inline-block; width:auto; height:35px; border-radius: 6px; background: #ECBD66; box-shadow: 1.421px 2.132px 4.264px 0 rgba(0, 0, 0, 0.35);} .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont .btn_app + .btn_app {margin-left:5px;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont .btn_app a {display:inline-flex; width:100%; height:100%; align-items:center; justify-content:center; padding:0 8px; color: #1D1D1C;text-align: center;font-family: "Gmarket Sans TTF";font-size: 14.215px;font-weight: 700;letter-spacing: -0.05rem; word-spacing: -0.05rem;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont .btn_app a em {width:8px; margin-left:3px; padding-bottom:4px;} @media screen and (max-width: 410px) { .pop_evt_place .pop_inner {width:calc(100% - 30px);} .pop_evt_place .pop_inner .cont_list li .list_inner .item .it_ti span.type {font-size:14px; } .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont {padding:0 5px;} .pop_evt_place .pop_inner .cont_list li .item-app .item-app_cont .btn_app a {font-size:13px; line-height:1; padding:2px 8px 0;} } /* 쿠폰번호 오류 팝업 */ .popup.cp_error .inner { text-align:center;} .popup.cp_error .inner strong {display:inline-block; font-size:22px; margin-bottom:15px; font-weight:700; color:#1D1D1C; line-height:1.4; letter-spacing:-0.05rem;} .popup.cp_error .inner p {font-size:17px; font-weight:500; letter-spacing:-0.05rem; } .popup.cp_error .inner .bottom_btn { max-width: 180px; margin-top: 30px; background: #EABA60; color: #fff; } /* 사용된 쿠폰 알림 팝업 */ .popup.cp_used .inner { text-align:center;} .popup.cp_used .inner strong {display:inline-block; font-size:22px; font-weight:700; color:#1D1D1C; line-height:1.4; letter-spacing:-0.05rem; padding-top:20px;} .popup.cp_used .inner .bottom_btn { max-width: 180px; margin-top: 30px; background: #EABA60; color: #fff; } /* 꽝 다음 기회에! 알림 팝업 */ .popup.lose .inner { text-align:center;} .popup.lose .inner strong {display:inline-block; font-size:32px; margin-bottom:10px; font-weight:700; color:#1D1D1C; line-height:1.4; letter-spacing:-0.05rem; } .popup.lose .inner p {font-size:17px; font-weight:500; letter-spacing:-0.05rem; line-height:1.5;} .popup.lose .inner p b {font-weight:700;} .popup.lose .inner .bottom_btn { max-width: 180px; margin-top: 20px; background: #EABA60; color: #fff; } /****** 카카오 주소 검색 *******/ .pop_addr_search {position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:999; } .pop_addr_search .bg {width:100vw; height:100vh; background:rgba(0,0,0,.5);} .pop_addr_search .pop_inner { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:calc(100% - 40px); max-width:414px; min-height:567px; background:#ECBD66; border-radius:10px; } .pop_addr_search .pop_inner .top {width:100%; height:47px; background:#ECBD66; border-bottom:solid 1px #1D1D1C; border-radius:10px 10px 0 0; } .pop_addr_search .pop_inner .top a.btn_pop_close {display:block; position:absolute; top:12px; right:12px; width:24px; height:24px;} .pop_addr_search .pop_inner .top a.btn_pop_close img {width:100%;} .pop_addr_search .addr_search {width:100%; height:calc(567px - 47px); border-radius:0 0 10px 10px; overflow:hidden;} /**************** 경고문구 ***************/ .warning_msg {padding:0 10px 35px;} .warning_msg p {color: #C5C5C5; text-align: center; font-size: 14px; font-weight: 400; line-height: 140%; letter-spacing: -0.35px;}