@charset "utf-8";
/******************** 공통 ********************/
.dim {position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.6); z-index:1000; display:none;}
body.noScroll {display:block; height:100%; overflow:hidden;}
html {scroll-behavior: smooth;}
* {letter-spacing:-1px; font-weight:400; line-height:1.0; word-break:keep-all;}
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } 
.embed-container iframe, .embed-container object, .embed-container embed , .embed-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.evWrap {position:relative; overflow:hidden;}
.evWrap .subDim {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.3); z-index:51; display:none;}

.gloHeader {display:flex; justify-content:space-between; align-items:center; position:absolute; left:0; top:0; padding:50px 80px; width:100%; z-index:100;}
.gloHeader .brand a {display:block; width:127px; height:54px; background:url(../images/logo_mt_all.svg) no-repeat 50% 50%; background-size:100%;}
.gloHeader .gloUtil {display:flex; justify-content:flex-start; align-items:center; gap:17px;}
.gloHeader .gloUtil .account {display:flex; justify-content:flex-start; align-items:center; gap:26px;}
.gloHeader .gloUtil .account .txtMenu {display:block; position:relative;}
.gloHeader .gloUtil .account .txtMenu a {display:block; color:#000; font-size:14px; font-weight:500; padding:12px 14px; border-radius:50px; border:1px solid #000;}
.gloHeader .gloUtil .logo a {display:block; width:75px; height:21px; background:url(../images/logo_miraen_kr.svg) no-repeat 50% 50%;}

.gloHeader.white .gloUtil .account .txtMenu a {color:#FFF; border:1px solid #FFF;}
.gloHeader.white .gloUtil .logo a {display:block; width:75px; height:21px; background:url(../images/logo_miraen_kr_w.svg) no-repeat 50% 50%; background-size:100%;}

/** 이벤트 하단 공통 **/
.eventCauSec {background:#222; position:relative; z-index:10;}
.eventCauSec * {font-family:'Pretendard Variable';}
.eventCauSec .innerCon {padding:90px 0; width:100%; max-width:1200px; margin:0 auto;}

.cauCon {display:block; height:auto; overflow:hidden;}
.cauCon .title {color:#FFF; font-size:26px; font-weight:500; margin-bottom:30px;}
.cauCon .title:before {content:''; display:inline-block; width:23px; height:23px; background:url(../images/ico_cau_w.svg) no-repeat 50% 50%; background-size:100%; margin-right:10px; vertical-align:0;}
.cauCon .cauBox {display:block; height:auto; overflow:hidden; margin-bottom:30px; padding-left:36px;}
.cauCon .cauBox .caTitle {color:#FFF; font-size:20px; padding-left:0px; position:relative; font-weight:500; margin-bottom:10px;}
.cauCon .cauBox li {display:block; height:auto; overflow:hidden; padding:4px 0 4px 35px; font-size:18px; position:relative; color:#FFF; line-height:1.4;}
.cauCon .cauBox li a {color:#CDFF70; font-weight:500; line-height:1.4;}
.cauCon .cauBox li:after {content:''; position:absolute; left:20px; top:15px; width:5px; height:1px; background:#FFF;}
.cauCon .cauBox li em {color:#FFF;}
.cauCon .cauBox li.cauMidTitle {color:#222; font-size:18px; margin-bottom:5px; padding-left:15px;}
.cauCon .cauBox li.cauMidTitle.device {margin-top:15px;}
.cauCon .cauBox li.cauMidTitle:after {background:none;}
.cauCon .cauBox li.simple:after {display:none;}

/** paging **/
.pagingWrap {display:flex; justify-content:center; align-items:center; gap:5px; margin:60px 0;}
.pagingWrap a {display:inline-flex; justify-content:center; align-items:center; border-radius:50%; color:#000; font-size:16px; width:40px; height:40px; line-height:1.0; font-weight:400;}
.pagingWrap a.dir {border:2px solid transparent; width:30px;}
.pagingWrap a.dir.first {background:url(../images/btn_dir_end.svg) no-repeat 50% 50%; background-size:auto 36px; transform:rotate(180deg);}
.pagingWrap a.dir.forward {background:url(../images/btn_dir.svg) no-repeat 50% 50%; background-size:auto 36px; transform:rotate(180deg);}
.pagingWrap a.dir.back {background:url(../images/btn_dir_end.svg) no-repeat 50% 50%; background-size:auto 36px;}
.pagingWrap a.dir.backword {background:url(../images/btn_dir.svg) no-repeat 50% 50%; background-size:auto 36px;}
.pagingWrap a.on {background:#000; color:#FFF; font-weight:700; position:relative;}

.forDesk {display:block;}
.forPc {display:block;}
.forMo {display:none;}

.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content div {height:auto; padding:5px 0;}

/******* btn *******/
.btn a {display:inline-flex; justify-content:center; align-items:center; height:76px; gap:10px; padding:0 44px; color:#FFF; font-size:26px; position:relative; font-weight:700; position:relative; letter-spacing:0; box-shadow: 2px 8px 0 0 #000; border: 3px solid #000;}
.btn a em {font-weight:700; margin-left:-5px;}
.btn a:after {content:''; width:28px; height:30px; background:url(../images/ev/deco_ar.svg) no-repeat 50% 50%; background-size:100%;}

.btn.moreService a {background:#5D4B40;}
.btn.cancel a {background:#999; color:#FFF;}
.btn.cancel a:after {display:none;}
.btn.confirm a {background: #0188CB;}
.btn.confirm.doExp a {background: #29BDAE;}
.btn.confirm a {background: #0188CB;}
/* .btn.confirm a.btn-submit {width:104px;} */
.btn.dis a {background:#ccc; width:auto; text-align:center; justify-content:center; cursor:default;}
.btn.dis a:after {display:none;}

#evCont02 .btn.confirm a {background:#29BDAE;}
#evCont02 .btn.confirm.dis a {background:#999; color:#FFF;}
#evCont02 .btn.confirm#apply_reset_btn a {background:#999; color:#FFF;}
#evCont02 .btn.confirm.edit a {background:#70c9e3; color:#FFF;}
/******************** 공통 ********************/

/******************** 개별 이벤트 ********************/
.innerCon {position:relative; width:100%; max-width:1200px; margin:0 auto;}
.blindFin {position:absolute; left:0; top:0; width:100%; height:420px; background:transparent; z-index:100;}

.evHead {position:relative; padding:170px 0 160px; background:url(../images/ev/ptn_green.png) repeat left top;}
.evHead:after {content:''; position:absolute; left:0; bottom:0; width:518px; height:410px; background:url(../images/ev/deco_top_left.png) no-repeat 50% 50%; background-size:100%;}
.evHead:before {content:''; position:absolute; right:0; top:0; width:518px; height:410px; background:url(../images/ev/deco_top_right.png) no-repeat 50% 50%; background-size:100%;}
.evHead .innerCon {text-align:center;}
.evHead .evTxt {display:inline-flex; justify-content:center; align-items:center; gap:12px; color:#222; font-size:36px; font-family:'GmarketSans'; line-height:1.0;}
.evHead .evTxt img {margin-bottom:7px;}
.evHead .innerCon > img {max-width:1154px; margin:0 auto;}
.evHead .evHeadDesc {color:#222; font-size:28px; line-height:1.5; font-family:'GmarketSans';}
.evHead .evHeadDesc span {box-shadow: inset 0 -16px 0 #CDFF70;}
.evHead .target {display:inline-flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:14px; margin-top:40px;}
.evHead .target li {display:flex; justify-content:flex-start; align-items:center; gap:12px;}
.evHead .target li .item {width:160px; padding:14px 0 9px; display:flex; justify-content:center; align-items:center; flex:0 0 auto; color:#FFF; font-size:24px; font-family:'GmarketSans'; background:#222; border-radius:100px;}
.evHead .target li .ipCon {color:#222; font-size:30px; font-weight:500;}
.evHead .target li .ipCon em {font-weight:700;}

.evTab {display:flex; justify-content:flex-start; align-items:stretch;}
.evTab > a {display:flex; justify-content:flex-start; align-items:center; width:50%; background:#D3D3D3;}
.evTab > a.tab01 {justify-content:flex-end;}
.evTab > a .menuTxt {display:block; width:100%; max-width:600px; text-align:center; display:flex; justify-content:center; align-items:center; line-height:1.0; padding:21px 0; color:#949494; font-size:32px; font-family:'GmarketSansBold'; gap:16px;}
.evTab > a .menuTxt span {padding:9px 14px 4px 14px; color:#D3D3D3; font-size:24px; background:#949494; margin-bottom:2px;}
.evTab > a.on {background:#FFF;}
.evTab > a.on .menuTxt {color:#222;}
.evTab > a.on .menuTxt span {color:#222; background:#FFDB64;}

.evService {position:relative; display:none;}

.evProcess {position:relative; padding:110px 0;}
.evProcess .innerCon {max-width:886px;}
.evProcess .evInfo {position:relative; border:2px dotted #000; padding:52px 36px;}
.evProcess .evInfo .decoSet {position:absolute; left:0; top:0; width:100%; height:100%;}
.evProcess .evInfo .decoSet span {position:absolute; width:16px; height:16px; background:url(../images/ev/square_corner.svg) no-repeat 50% 50%; background-size:100%;}
.evProcess .evInfo .decoSet span:first-child {left:-8px; top:-8px;}
.evProcess .evInfo .decoSet span:nth-child(2) {right:-8px; top:-8px;}
.evProcess .evInfo .decoSet span:nth-child(3) {right:-8px; bottom:-8px;}
.evProcess .evInfo .decoSet span:nth-child(4) {left:-8px; bottom:-8px;}
.evProcess .evInfo .decoAr {position:absolute; right:-34px; bottom:-34px; width:34px; height:34px; background:url(../images/ev/deco_ar.svg) no-repeat 50% 50%; background-size:100%;}
.evProcess .evInfo .infoTxt {text-align:center; color:#222; font-size:52px; font-family:'GmarketSansBold'; letter-spacing:-3px; gap:12px; position:relative; z-index:1; vertical-align:middle; margin-bottom:10px; line-height:1.1;}
.evProcess .evInfo .infoTxt br {display:none;}
.evProcess .evInfo .infoTxt img {vertical-align:-14px; width:186px;}
.evProcess .evInfo .infoDesc {text-align:center; line-height:1.5; color:#222; font-size:20px; font-family:'GmarketSans'; margin-top:8px;}
.evProcess .evInfo .infoDesc span {box-shadow: inset 0 -12px 0 #CDFF70;}
.evProcess .evInfo .evGift {width:100%; max-width:694px; margin:90px auto 0; position:relative;}
.evProcess .evInfo .evGift .imgSec {position:relative; padding:0px 0px 0px 266px; background:#FFDB65; border-radius:200px; display:block; height:132px;}
.evProcess .evInfo .evGift .imgSec img {width:266px; position:absolute; left:0; bottom:0;}
.evProcess .evInfo .evGift .giftTarget {position:absolute; left:10px; bottom:-30px;}
.evProcess .evInfo .evGift .giftTarget img {width:85px;}
.evProcess .evInfo .evGift .txtSec {position:absolute; left:266px; bottom:22px;}
.evProcess .evInfo .evGift .txtSec .giftTitle {color:#222; font-size:24px; letter-spacing:-2px; line-height:1.3; font-family:'GmarketSans';}
.evProcess .evInfo .evGift .txtSec .giftTitle strong {font-family:'GmarketSansBold';}
.evProcess .evInfo .evGift .txtSec .giftDesc {color:#222; font-size:14px; font-weight:500; margin-top:6px;}

.evProcess .joinStep {padding-top:100px; position:relative; display:flex; justify-content:flex-start; align-items:flex-start; gap:80px;}
.evProcess .joinStep .titleSec {color:#222; font-size:42px; font-family:'GmarketSansBold'; width:240px; flex:0 0 auto;}
.evProcess .joinStep .titleSec .jsTitle {letter-spacing:-3px;}
.evProcess .joinStep .titleSec .jsDesc {color:#222; font-size:14px; line-height:1.5; font-family:'Pretendard Variable'; margin-top:6px; text-align:justify; padding-left:14px; position:relative; letter-spacing:0;}
.evProcess .joinStep .titleSec .jsDesc span {position:absolute; left:0; top:2px;}
.evProcess .joinStep .stepCont {position:relative; display:flex; justify-content:flex-start; align-items:flex-start; gap:32px; flex-direction:column; width:100%; max-width:446px;}
.evProcess .joinStep .stepCont:after {content:''; position:absolute; left:7px; top:6px; width:2px; height:100%; border-left:2px dotted #000;}
.evProcess .joinStep .stepCont .perStep {position:relative; flex:0 1 auto; width:100%; z-index:1;}
.evProcess .joinStep .stepCont .perStep:after {content:''; position:absolute; left:0px; top:5px; width:16px; height:16px; border-radius:50%; border:4px solid #000; box-sizing:border-box; background:#FFF;}
.evProcess .joinStep .stepCont .perStep .deco {position:absolute; width:160px; height:160px;}
.evProcess .joinStep .stepCont .perStep .deco.no01 {right:-102px; top:0; background:url(../images/ev/ico_pro0101.png) no-repeat 50% 50%; background-size:100%;}
.evProcess .joinStep .stepCont .perStep .deco.no02 {left:-170px; top:-10px; background:url(../images/ev/ico_pro0102.png) no-repeat 50% 50%; background-size:100%;}
.evProcess .joinStep .stepCont .perStep .deco.no03 {right:-102px; top:-28px; background:url(../images/ev/ico_pro0103.png) no-repeat 50% 50%; background-size:100%;}
.evProcess .joinStep .stepCont .perStep .title {display:inline-block; position:relative; color:#222; font-size:30px; font-family:'GmarketSans'; box-shadow: inset 0 -12px 0 #CDFF70; margin:0 0 16px 34px; z-index:1; line-height:1.0;}
.evProcess .joinStep .stepCont .perStep .period {display:block; margin-bottom:16px; padding-left:28px;}
.evProcess .joinStep .stepCont .perStep .period span {display:inline-block; color:#FFF; font-size:16px; padding:10px 14px 8px 14px; line-height:1.0; border-radius:100px; background:#222; font-family:'GmarketSans';}
.evProcess .joinStep .stepCont .perStep ul {margin-left:34px; background:#EFEFEF; padding:16px; border-radius:4px; counter-reset: circle; }
.evProcess .joinStep .stepCont .perStep ul li {counter-increment: circle; padding-left:20px; position:relative; color:#222; font-size:18px; font-weight:500; line-height:1.5;}
.evProcess .joinStep .stepCont .perStep ul li span {font-weight:400;}
.evProcess .joinStep .stepCont .perStep ul li:before {content: counter(circle, circled-decimal); position: absolute; left: 0; top:0px;}
.evProcess .joinStep .stepCont .perStep ul li img.sampleBtn {width:auto; height:38px;}
.evProcess .joinStep .stepCont .perStep ul li strong {font-weight:600;}
.evProcess .joinStep .stepCont .perStep ul li.noNum {counter-increment: none; padding-left:0;}
.evProcess .joinStep .stepCont .perStep ul li.noNum:before {display:none;}

.evUseGuide {padding:100px 0; background:url(../images/ev/ptn_gray.png) repeat left top; background-size:47px;}
.evUseGuide .innerCon {text-align:center;}
.evTitle {display:inline-block; margin:0 auto 48px;}
.evTitle.maB {margin:0 auto 24px;}
.evTitle img {height:130px;}
.guideTxt {text-align:center; color:#222; font-size:22px; line-height:1.5; font-family:'GmarketSans'; margin-bottom:30px;}
.guideTxt span {font-family:'GmarketSansBold'; box-shadow: inset 0 -12px 0 #CDFF70;}
.evUseGuide .evGuide {background:#FFF; padding:28px; border-radius:16px; box-shadow: 0 2.015px 8.06px 0 rgba(0, 0, 0, 0.30); width:100%; max-width:1080px; margin:0 auto; position:relative;}
.evUseGuide .evGuide img {width:100%;}
.evUseGuide .evGuide .guide-prev {position:absolute; left:-90px; top:50%; transform:translate(0, -50%) rotate(180deg); width:60px; height:60px; background:url(../images/ev/dir_on.svg) no-repeat 50% 50%; background-size:100%; cursor:pointer;}
.evUseGuide .evGuide .guide-next {position:absolute; right:-90px; top:50%; transform:translate(0, -50%); width:60px; height:60px; background:url(../images/ev/dir_on.svg) no-repeat 50% 50%; background-size:100%; cursor:pointer;}
.evUseGuide .evGuide .guide-prev.swiper-button-disabled {background:url(../images/ev/dir_off.svg) no-repeat 50% 50%; background-size:100%;}
.evUseGuide .evGuide .guide-next.swiper-button-disabled {background:url(../images/ev/dir_off.svg) no-repeat 50% 50%; background-size:100%;}
.expBtns {position:relative; margin:32px 0 0; text-align:center;}
.expBtns .cauTxt {color:#222; font-size:22px; font-family:'GmarketSans'; text-align:center; margin-top:32px; line-height:1.4;}
.expBtns .cauTxt span {box-shadow: inset 0 -12px 0 #CDFF70;}
.btnArea {display:flex; justify-content:center; align-items:center; gap:10px;}

.cauT {display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:30px; flex-direction:column;}
.cauT strong {font-family:'GmarketSansBold';}
.cauT li {display:flex; justify-content:flex-start; align-items:flex-start; gap:10px; color:#222; font-size:22px; font-family:'GmarketSans'; line-height:1.3; position:relative;}
.cauT li p span {box-shadow: inset 0 -12px 0 #CDFF70;}
.cauT li:before {content:'*';}

.joinForm {position:relative; padding:100px 0;}
.joinForm .innerCon {max-width:1080px; text-align:center;}
.joinForm .form {position:relative; display:flex; justify-content:flex-start; align-items:flex-start; gap:32px 16px; flex-wrap:wrap;}
.joinForm .form .inputBlock {position:relative; width:100%;}
.joinForm .form .inputBlock.half {width:calc(50% - 8px);}
.joinForm .form .inputBlock .formTitle {display:flex; justify-content:flex-start; align-items:center; position:relative; color:#222; font-size:25px; font-weight:700; line-height:1.3; margin-bottom:16px;}
.joinForm .form .inputBlock .formTitle br {display:none;}
.joinForm .form .inputBlock .formTitle:before {content:'✅'; margin-right:5px;}
.joinForm .form .inputBlock .formTitle span {margin-left:10px; padding:5px 14px; background:#EDEDED; border-radius:100px; color:#222; font-size:14px;}
.joinForm .form .inputBlock .formTitle em {font-size:20px; margin-left:5px;}
.joinForm .form .inputBlock .deco {position:absolute; right:0; top:-18px; width:122px; height:68px;}
.joinForm .form .inputBlock .inputByte {position:absolute; right:20px; bottom:20px; color:#838383; font-size:16px;}
.joinForm .form .inputBlock span.btnEdit {position:absolute; right:0; bottom:0; height:62px; color:#FFF; font-size:20px; background:#A6A6A6; z-index:10;}
.joinForm .form .inputBlock span.btnEdit a {display:block; width:100%; height:100%; line-height:62px; padding:0 24px; color:#FFF;}
.joinForm .form .inputBlock .cauTxt {text-align:center; margin-top:16px; color:#222; font-size:18px; letter-spacing:0;}
.joinForm .form input[type="text"] {display:inline-block; width:100%; height:62px; line-height:60px; padding:0 20px; border:1px solid #ddd; box-sizing:border-box; color:#222; font-size:18px; border-radius:0;}
.joinForm .form textarea {display:inline-block; width:100%; height:210px; line-height:1.3; padding:20px; border:1px solid #ddd; box-sizing:border-box; color:#222; font-size:18px; border-radius:0;}
.joinForm .form textarea[readonly] {background:#f0f0f0;}

.evReview {position:relative; padding:100px 0; background:url(../images/ev/ptn_green.png) repeat left top; background-size:48px;}
.evReview:before {content:''; position:absolute; left:0; bottom:-20px; width:726px; height:478px; background:url(../images/ev/deco_btm_left.png) no-repeat 50% 50%; background-size:100%;}
.evReview:after {content:''; position:absolute; right:calc((100% - 1080px) / 12); top:140px; width:270px; height:334px; background:url(../images/ev/deco_btm_right.png) no-repeat 50% 50%; background-size:100%;}
.evReview .deco {position:absolute; right:calc((100% - 1080px) / 4); bottom:30%; width:82px; height:82px; background:url(../images/ev/deco_btm_right_btm.png) no-repeat 50% 50%; background-size:100%;}
.evReview .joinTitle {display:flex; justify-content:center; align-items:center; text-align:center; color:#222; font-size:52px; font-family:'GmarketSansBold'; gap:10px; margin-bottom:48px;}
.evReview .joinTitle img {margin-bottom:8px;}

.reviewList {display:flex; justify-content:flex-start; align-items:flex-start; gap:24px; flex-direction:column; width:100%; max-width:1080px; margin:0 auto; position:relative; z-index:10;}
.reviewList .reviewBox {position:relative; background:#FFF; border:2px solid #028d7f; filter: drop-shadow(8px 8px 0 #028d7f); width:100%; padding:32px;}
.reviewList .reviewBox.my {border:2px solid #000; filter: drop-shadow(8px 8px 0 #000);}
.reviewList .reviewBox .writer {position:relative; display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; margin-bottom:16px; border-bottom:1px solid #ddd;}
.reviewList .reviewBox .writer .teaId {display:flex; justify-content:flex-start; align-items:center; gap:20px; color:#222; font-size:16px; line-height:1.0; letter-spacing:0;}
.reviewList .reviewBox .writer .teaId .rvDate {position:relative;}
.reviewList .reviewBox .writer .teaId .rvDate:after {content:''; position:absolute; right:-12px; top:2px; width:1px; height:12px; background:#666;}
.reviewList .reviewBox .reviewFunc {position:relative;}
.reviewList .reviewBox .reviewFunc .btns {display:flex; justify-content:flex-start; align-items:center; gap:20px;}
.reviewList .reviewBox .reviewFunc .btns .txt {position:relative;}
.reviewList .reviewBox .reviewFunc .btns .txt:after {content:'';  position:absolute; right:-12px; top:1px; width:1px; height:12px; background:#999;}
.reviewList .reviewBox .reviewFunc .btns .txt:last-child:after {display:none;}
.reviewList .reviewBox .reviewFunc .btns .txt a {color:#999; font-size:14px; font-weight:500;}
.reviewList .reviewBox .reviewCon {color:#222; font-size:16px; font-weight:500; line-height:1.4; word-break:break-all; letter-spacing:0;}

.evShareJoin {padding:100px 0; background:url(../images/ev/ptn_gray.png) repeat left top; background-size:47px; position:relative; z-index:10;}
.evShareJoin .innerCon {max-width:1080px; display:flex; justify-content:flex-start; align-items:stretch; gap:32px;}
.evShareJoin .perSj {width:calc(50% - 16px); border:4px solid #000; filter: drop-shadow(8px 8px 0 #000); padding:32px 40px; position:relative; background:#FFF;}
.evShareJoin .perSj:hover {background:#FFF266;}
.evShareJoin .perSj .txtSec {margin-bottom:48px;}
.evShareJoin .perSj .txtSec .txt {color:#000; font-size:28px; line-height:1.3; font-family:'GmarketSans';}
.evShareJoin .perSj .txtSec .strong {color:#000; font-size:28px; font-family:'GmarketSansBold'; line-height:1.3;}
.evShareJoin .perSj .obj {position:absolute; right:24px; bottom:20px; width:178px;}
.evShareJoin .perSj .obj img {width:178px;}
.evShareJoin .perSj a {background:#000; color:#FFF; font-size:20px; font-weight:600; display:inline-flex; justify-content:flex-start; align-items:center; gap:16px; padding:12px 20px;}
.evShareJoin .perSj a:after {content:''; width:22px; height:22px; background:url(../images/ev/ico_ar.svg) no-repeat 50% 50%; background-size:100%;}
.evShareJoin .perSj a.btnShare:after {content:''; width:22px; height:22px; background:url(../images/ev/ico_share.svg) no-repeat 50% 50%; background-size:100%;}

#evCont02 .evProcess .joinStep .stepCont {max-width:464px;}
#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no01 {right:-110px; top:0; background:url(../images/ev/ico_pro0201.png) no-repeat 50% 50%; background-size:100%;}
#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no02 {left:-170px; top:-70px; background:url(../images/ev/ico_pro0202.png) no-repeat 50% 50%; background-size:100%;}
#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no03 {right:-102px; top:-78px; background:url(../images/ev/ico_pro0203.png) no-repeat 50% 50%; background-size:100%;}

#evCont02 .evUseGuide .innerCon {max-width:1080px;}
.imgCont {display:flex; justify-content:space-between; align-items:flex-end;}

.popCauTxt {display:block; padding-top:10px; margin-top:10px; border-top:1px dashed #ccc; color:#666; font-size:16px; line-height:1.3;}

.expDim {position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:2000;}
.expPop {position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:90%; max-width:480px; height:auto; background:#FFF; z-index:2100; text-align:center; border-radius:16px; padding:40px 30px;}
.expPop .expTxt {text-align:center; color:#222; font-size:20px; font-family:'GmarketSans'; margin-bottom:20px; line-height:1.4;}

a.goTop {position:fixed; right:24px; bottom:24px; width:66px; height:66px; border-radius:50%; background:#2F2C29; display:flex; justify-content:center; align-items:center; flex-direction:column; color:#FFF; font-size:15px; font-weight:600; text-align:center; gap:8px;  z-index:1000; opacity:1; transform:translateX(0); transition:.4s all;}
a.goTop:before {content:''; width:18px; height:11px; background:url(../images/ev/ar_top.svg) no-repeat 50% 50%; background-size:100%; flex:0 0 auto;}
a.goTop.hide {opacity:0; transform:translateX(120px);}

@counter-style circled-decimal {
  system: fixed;
  /* 필요한 만큼 추가 가능 (여기선 1~20까지) */
  symbols: '①' '②' '③' '④' '⑤' '⑥' '⑦' '⑧' '⑨' '⑩'
           '⑪' '⑫' '⑬' '⑭' '⑮' '⑯' '⑰' '⑱' '⑲' '⑳';
  suffix: " ";
}

@media only screen and (max-width:1200px) {
	.gloHeader {padding:20px;}
	.evInner {padding:0 20px;}
	.eventCauSec .innerCon {padding:90px 20px;}
}

@media only screen and (max-width:720px) {
	.forDesk {display:none !important;}
	.forMo {display:block;}

	.gloHeader {padding:15px;}
	.gloHeader .brand a {width:64px; height:28px;}
	.gloHeader .gloUtil {gap:16px;}
	.gloHeader .gloUtil .logo a {width:75px !important; height:22px !important; background-size:100% auto !important;}
	.gloHeader .gloUtil .account .txtMenu a {font-size:12px; padding:6px 12px;}

	#mo-footer {margin-top:0;}
	#mo-footer .mo-ft-top {padding-top:0;}

	.eventCauSec .innerCon {padding:30px 20px;}
	.cauCon {margin-top:0px;}
	.cauCon .title {font-size:18px; margin-bottom:20px;}
	.cauCon .title:before {width:18px; height:18px; vertical-align:-2px; margin-right:5px;}
	.cauCon .cauBox {padding-left:11px;}
	.cauCon .cauBox:last-child {margin-bottom:0;}
	.cauCon .cauBox .caTitle {font-size:16px; padding-left:10px; margin-bottom:5px;}
	.cauCon .cauBox .caTitle:after {width:4px; height:4px; top:7px;}
	.cauCon .cauBox li {font-size:14px; line-height:1.3; padding:4px 0 4px 10px;}
	.cauCon .cauBox li:after {left:0px; top:11px;}

	/*********** 개별 이벤트  **************/
	.evHead {padding:80px 0; background-size:24px;}
	.evHead:before {width:118px; height:94px; display:none;}
	.evHead:after {width:118px; height:94px;}
	.evHead .evTxt {font-size:18px;}
	.evHead .evTxt img {width:77px;}
	.evHead .evHeadDesc {font-size:18px; padding:0 20px; line-height:1.3;}
	.evHead .target {padding:0 20px; margin-top:24px; gap:6px; z-index:10; position:relative;}
	.evHead .target li .item {width:110px; padding:10px 0; font-size:16px; line-height:1.0;}
	.evHead .target li .ipCon {font-size:18px; text-align:left;}

	.evTab > a .menuTxt {font-size:16px; position:relative; padding:15px 0;}
	.evTab > a .menuTxt span {position:absolute; left:50%; top:-20px; transform:translate(-50%, 0); font-size:14px; padding:8px 12px;}

	.evProcess {padding:60px 20px;}
	.evProcess .evInfo {padding:30px 20px;}
	.evProcess .evInfo .decoSet span {width:12px; height:12px;}
	.evProcess .evInfo .decoSet span:first-child {left:-6px; top:-6px;}
	.evProcess .evInfo .decoSet span:nth-child(2) {right:-6px; top:-6px;}
	.evProcess .evInfo .decoSet span:nth-child(3) {right:-6px; bottom:-6px;}
	.evProcess .evInfo .decoSet span:nth-child(4) {left:-6px; bottom:-6px;}
	.evProcess .evInfo .infoTxt {font-size:26px;}
	.evProcess .evInfo .infoTxt br {display:block;}
	.evProcess .evInfo .infoTxt img {width:90px;}
	.evProcess .evInfo .infoDesc {font-size:16px;}

	#evCont02 .evProcess .evInfo .infoTxt img {vertical-align:-6px;}
	#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no01 {right:0; top:28px;}
	#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no02 {top:0px; left:160px;}
	#evCont02 .evProcess .joinStep .stepCont .perStep .deco.no03 {right:unset; top:0px; left:180px;}

	.evProcess .evInfo .evGift {margin:60px auto 0;}
	.evProcess .evInfo .evGift .giftTarget {width:64px; height:64px; bottom:unset; top:56px; left:15%;}
	.evProcess .evInfo .evGift .imgSec {height:100px;}
	.evProcess .evInfo .evGift .imgSec img {width:210px; left:50%; transform:translate(-50%, 0);}
	.evProcess .evInfo .evGift .txtSec {display:block; position:relative; left:unset; bottom:unset; margin-top:30px;}
	.evProcess .evInfo .evGift .txtSec .giftTitle {font-size:18px; text-align:center;}
	.evProcess .evInfo .evGift .txtSec .giftDesc {font-size:12px; text-align:center;}
	.evProcess .evInfo .decoAr {width:16px; height:16px; right:-17px; bottom:-17px;}

	.evProcess .joinStep {display:block; padding-top:40px;}
	.evProcess .joinStep .titleSec {width:100%; text-align:center; font-size:24px; margin-bottom:24px;}
	.evProcess .joinStep .titleSec .jsDesc {text-align:left; line-height:1.3;}
	.evProcess .joinStep .stepCont .perStep .title {font-size:20px; padding-top:5px; margin:0 0 10px 24px;}
	.evProcess .joinStep .stepCont .perStep ul {margin-left:24px; padding:14px;}
	.evProcess .joinStep .stepCont .perStep ul li {font-size:16px;}
	.evProcess .joinStep .stepCont .perStep .deco {width:50px; height:50px;}
	.evProcess .joinStep .stepCont .perStep .deco.no01 {right:0; top:-5px;}
	.evProcess .joinStep .stepCont .perStep .deco.no02 {right:0; top:-5px; left:unset;}
	.evProcess .joinStep .stepCont .perStep .deco.no03 {right:0; top:-5px;}
	.evProcess .joinStep .stepCont .perStep .period {margin-bottom:10px; padding-left:24px;}
	.evProcess .joinStep .stepCont .perStep .period span {font-size:14px; padding:6px 16px;}

	.evUseGuide {padding:60px 20px; background-size:24px;}
	.evTitle {margin-bottom:24px;}
	.evTitle img {height:55px;}
	.evUseGuide .evGuide {padding:0; border-radius:6px;}
	.evUseGuide .swiper-container {border-radius:6px;}
	.evUseGuide .evGuide .guide-prev {width:30px; height:30px; left:-15px; z-index:10; background-size:20px;}
	.evUseGuide .evGuide .guide-next {width:30px; height:30px; right:-15px; z-index:10; background-size:20px;}
	.evUseGuide .evGuide .guide-prev.swiper-button-disabled {background-size:20px;}
	.evUseGuide .evGuide .guide-next.swiper-button-disabled {background-size:20px;}

	.joinForm {padding:60px 20px;}
	.joinForm .form {gap:16px;}
	.joinForm .form .inputBlock .formTitle {align-items:flex-start; font-size:16px; margin-bottom:8px; text-align:left;}
	.joinForm .form .inputBlock .formTitle br {display:block;}
	.joinForm .form .inputBlock .deco {width:64px; height:36px; top:-6px;}
	#evCont02 .joinForm .form .inputBlock .deco {top:-7px;}

	.joinForm .form textarea {height:180px; padding:16px; font-size:16px;}
	.joinForm .form .inputBlock .inputByte {right:16px; bottom:16px; font-size:12px;}

	.evReview {padding:60px 0; background-size:24px;}
	.evReview .deco {display:none;}
	.evReview:after {display:none;}
	.evReview:before {display:none;}
	.evReview .joinTitle {font-size:24px; margin-bottom:16px;}
	.evReview .joinTitle img {width:88px;}

	.evShareJoin {padding:60px 20px;}
	.evShareJoin .innerCon {flex-direction:column;}
	.evShareJoin .perSj {width:100%; padding:16px; border:2px solid #000; filter: drop-shadow(4px 4px 0 #000);}
	.evShareJoin .perSj .txtSec {margin-bottom:30px;}
	.evShareJoin .perSj .txtSec .txt {font-size:16px;}
	.evShareJoin .perSj .txtSec .strong {font-size:16px;}
	.evShareJoin .perSj .obj {right:16px; bottom:16px; width:90px;}
	.evShareJoin .perSj .obj img {width:90px;}
	.evShareJoin .perSj a {font-size:16px; padding:10px 16px; gap:8px;}
	.evShareJoin .perSj a:after {width:14px; height:14px;}
	.evShareJoin .perSj a.btnShare:after {width:14px; height:14px;}

	.btn a {height:56px; font-size:20px; padding:0 24px; gap:6px; box-shadow: 2px 6px 0 0 #000; border: 2px solid #000;}
	.btn a:after {width:20px; height:24px; background-size:100% auto;}
	.expBtns .cauTxt {margin-top:30px; font-size:14px;}

	.guideTxt {font-size:16px; line-height:1.5; margin-bottom:20px;}
	.cauT {margin-bottom:20px;}
	.cauT li {font-size:16px; line-height:1.5; display:block; text-align:center;}
	.cauT li:before {display:inline-block; margin-right:5px;}
	.cauT li p {line-height:1.3; display:inline-block;}

	.imgCont {justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:16px;}

	.joinForm .form .inputBlock.half {width:100%;}
	.joinForm .form input[type="text"] {height:42px; line-height:40px; font-size:14px;}
	.joinForm .form .inputBlock .formTitle em {font-size:14px;}
	.joinForm .form .inputBlock span.btnEdit {height:42px; font-size:16px;}
	.joinForm .form .inputBlock span.btnEdit a {padding:0 16px; line-height:42px;}

	.reviewSec {padding:0 20px;}
	.reviewList {gap:20px;}
	.reviewList .reviewBox {border:1px solid #028d7f; filter: drop-shadow(4px 4px 0 #028d7f); width:100%; padding:16px;}
	.reviewList .reviewBox.my {border:1px solid #000; filter: drop-shadow(4px 4px 0 #000);}
	.reviewList .reviewBox .writer .teaId {flex-direction:column; gap:5px; align-items:flex-start; font-size:14px;}
	.reviewList .reviewBox .reviewCon {font-size:14px; line-height:1.3;}
	.reviewList .reviewBox .writer .teaId .rvDate:after {display:none;}

	.pagingWrap {gap:0px; margin:30px 0;}
	.pagingWrap a {width:30px; height:30px; font-size:16px;}
	.pagingWrap a.dir.first {background-size:auto 30px;}
	.pagingWrap a.dir.forward {background-size:auto 30px;}
	.pagingWrap a.dir.back {background-size:auto 30px;}
	.pagingWrap a.dir.backword {background-size:auto 30px;}

	.expPop {padding:30px 20px; border-radius:8px;}
	.expPop .expTxt {font-size:16px; margin-bottom:10px;}

	a.goTop {width:48px; height:48px; font-size:10px; gap:4px; right:16px; bottom:16px;}
	a.goTop:before {height:8px; background-size:auto 8px;}

}

@media only screen and (max-width:420px) {

}