@charset "utf-8";
@import url('//css.mirae-n.com/miraen_fonts/font/nanum/fonts.css');
@font-face { font-family: 'YeogiOttaeJalnan'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff'); font-weight: normal; font-display: swap; }
/*
font-family: 'NanumSquareRound', sans-serif;
font-weight: 300; 400; 700; 800;
*/
/******************** 공통 ********************/
.wrap * {font-family: 'NanumSquareRound', sans-serif; font-weight:400;}

.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;}
* {letter-spacing:0px; 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(../../../img/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(../../../img/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(../../../img/logo_miraen_kr_w.svg) no-repeat 50% 50%; background-size:100%;}

/** 이벤트 하단 공통 **/
.eventCauSec {background:#333; position:relative; z-index:10;}
.eventCauSec .innerCon {padding:60px 0; width:100%; max-width:1200px; margin:0 auto;}

.cauCon {display:block; height:auto; overflow:hidden;}
.cauCon .title {color:#FFF; font-size:40px; font-weight:800; margin-bottom:30px; display:flex; align-items:center; gap:10px;}
.cauCon .title:before {content:''; width:43px; height:43px; background:url(../../../img/ico_cau_gray.svg) no-repeat 50% 50%; background-size:100%;}
.cauCon .cauBox {display:block; height:auto; overflow:hidden; margin-bottom:30px; padding-left:36px;}
.cauCon .cauBox .caTitle {color:#FFF; font-size:22px; padding:4px 0; position:relative; font-weight:800; margin-bottom:10px;}
.cauCon .cauBox li {display:block; padding:0 0 0 35px; font-size:22px; position:relative; color:#FFF; line-height:1.8;}
.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:70px 0 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(../../../img/btn_dir_end.svg) no-repeat 50% 50%; background-size:auto 36px; transform:rotate(180deg);}
.pagingWrap a.dir.forward {background:url(../../../img/btn_dir.svg) no-repeat 50% 50%; background-size:auto 36px; transform:rotate(180deg);}
.pagingWrap a.dir.back {background:url(../../../img/btn_dir_end.svg) no-repeat 50% 50%; background-size:auto 36px;}
.pagingWrap a.dir.backword {background:url(../../../img/btn_dir.svg) no-repeat 50% 50%; background-size:auto 36px;}
.pagingWrap a.on {background:#5A371E; 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 {display:inline-block;}
.btn a {display:flex; justify-content:center; align-items:center; padding:20px 36px; gap:8px; color:#FFF; font-size:24px; font-weight:700; position:relative; border-radius:8px;}

.btn.moreService a {background:#5D4B40;}
.btn.cancel a {background:#999; color:#FFF;}
.btn.confirm a {background: #5A371E;}
.btn.dis a {background:#ccc; width:auto; text-align:center; justify-content:center; cursor:default;}
.btn.dis a:after {display:none;}
/******************** 공통 ********************/

/******************** 개별 이벤트 ********************/
.innerCon {position:relative; width:100%; max-width:1200px; margin:0 auto; padding:110px 0; z-index:10;}
.evHead {position:relative; background:#423CB1 url(../img/head_bg_line.png) no-repeat 50% 50%; background-size:110% auto;}
.evHead:before {content:''; position:absolute; left:calc((50% - 854px) / 2); top:50%; transform:translate(0, -50%); width:569px; height:700px; background:url(../img/head_deco01.svg) no-repeat 50% 50%; background-size:100%;}
.evHead:after {content:''; position:absolute; right:calc((50% - 854px) / 2); top:50%; transform:translate(0, -50%); width:569px; height:700px; background:url(../img/head_deco02.svg) no-repeat 50% 50%; background-size:100%;}
.evHead .innerCon {max-width:1010px; text-align:center; padding:90px 0 40px;}
.evHead .logoPartner {margin:0 auto; text-align:center;}
.evHead .round {height:48px; position:relative; margin:20px 0 30px; background:#ffea70; display:inline-flex; justify-content:center; align-items:center;}
.evHead .round:before {content:''; position:absolute; left:-28px; top:0; width:30px; height:49px; background:url(../img/head_round_left.svg) no-repeat left top; background-size:100%;}
.evHead .round:after {content:''; position:absolute; right:-28px; top:0; width:30px; height:49px; background:url(../img/head_round_left.svg) no-repeat right center; background-size:100%; transform:rotate(180deg);}
.evHead .round p {color:#423CB1; font-size:25px; font-family:'YeogiOttaeJalnan'; position:relative; z-index:1;}
.evHead h2 {width:100%; max-width:682px; margin:0 auto;}
.evHead .headCont {position:relative;}
.evHead .headCont .inCont {position:relative; width:590px; height:363px; background:url(../img/head_note.svg) no-repeat 50% 50%; background-size:100%; margin:0 auto; padding-top:60px; text-align:center;}
.evHead .headCont .inCont .title {color:#252525; font-size:30px; font-weight:800; line-height:1.3;}
.evHead .headCont .inCont .title em {color:#423CB1; font-size:30px; font-weight:800;}
.evHead .headCont .inCont .desc {position:relative; margin:26px 0;}
.evHead .headCont .inCont .desc strong {display:block; color:#252525; font-size:20px; font-weight:800; line-height:1.4; margin-bottom:8px;}
.evHead .headCont .inCont .desc p {color:#252525; font-size:18px; font-weight:400; line-height:1.4;}
.evHead .headCont .inCont .headTags {display:flex; justify-content:center; align-items:center; gap:6px;}
.evHead .headCont .inCont .headTags span {position:relative; padding:8px 17px 8px 8px; display:flex; align-items:center; gap:6px; color:#423CB1; font-size:16px; font-family:'YeogiOttaeJalnan'; border:1px solid #9395FF; border-radius:100px;}
.evHead .headCont .inCont .headTags span:before {content:''; width:24px; height:24px; background:url(../img/ico_hash.svg) no-repeat 50% 50%; background-size:100%;}
.evHead .headCont .deco01 {position:absolute; left:0; bottom:60px; width:280px;}
.evHead .headCont .deco02 {position:absolute; right:0; bottom:60px; width:280px;}
.evHead .headCau {color:#FFF; margin-top:20px; font-size:18px; font-weight:400; line-height:1.6;}
.evHead .headCau em {color:#FFDB14; font-size:18px; font-weight:500;}
.evHead .piano {position:relative; height:120px; background:url(../img/head_ptn.svg) repeat-x left top; background-size:auto 120px;}

.section {position:relative;}
.section.cont01 {background:#FFEA70;}
.section .pTitleSec {text-align:center; position:relative; margin-bottom:50px;}
.section .pTitleSec .pTitle {display:inline-block; color:#000; font-size:60px; font-family:'YeogiOttaeJalnan'; position:relative;}
.section .pTitleSec .pTitle em {color:#423CB1; font-size:60px; font-family:'YeogiOttaeJalnan';}
.section .pTitleSec .pTitle .partRound {position:absolute; left:-68px; top:-50px; width:68px; height:68px; background:url(../img/part_round.svg) no-repeat 50% 50%; background-size:100%; text-align:center; color:#423CB1; font-size:30px; font-family:'YeogiOttaeJalnan'; padding-top:20px;}
.section .pTitleSec .pDesc {color:#252525; font-size:30px; font-weight:800; line-height:1.4; margin-top:20px;}
.section .pTitleSec .pDesc em {color:#423CB1; font-size:30px; font-weight:800;}

.expSec {position:relative; padding:50px 70px; border-radius:30px; background:#FFF;}
.expSec .expCont {position:relative;}
.expSec .expCont .inExpTitle {text-align:center; margin:40px 0 30px;}
.expSec .expCont .inExpTitle .seTitle {color:#252525; font-size:40px; font-family:'YeogiOttaeJalnan'; margin-bottom:20px;}
.expSec .expCont .inExpTitle .seDesc {color:#424242; font-size:18px; line-height:1.4;}
.expSec .expCont .perExp {border-radius:30px; background:#423CB1; padding:50px;}
.expSec .expCont .expPaging {position:absolute; left:0; bottom:18px; width:100%; display:flex; gap:10px; z-index:10; justify-content:center; align-items:center;}
.expSec .expCont .expPaging .swiper-pagination-bullet {display:block; width:16px; height:16px; border-radius:50%; background:#D9D9D9; opacity:1.0;}
.expSec .expCont .expPaging .swiper-pagination-bullet-active {background:#FFEA70; opacity:1.0;}
.expSec .expCont .exp-prev {position:absolute; left:-25px; top:56%; transform:translate(0, -50%) rotate(180deg); width:50px; height:50px; background:url(../img/dir_on.svg) no-repeat 50% 50%; background-size:100%; z-index:10; cursor:pointer;}
.expSec .expCont .exp-next {position:absolute; right:-25px; top:56%; transform:translate(0, -50%); width:50px; height:50px; background:url(../img/dir_on.svg) no-repeat 50% 50%; background-size:100%; z-index:10; cursor:pointer;}
.expSec .expCont .swiper-button-disabled {background:url(../img/dir_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont {position:relative; border-radius:24px; overflow:hidden;}
.perExpCont .emo02Exp {position:absolute; left:13%; bottom:10.5%; width:calc(100% - 20%); display:flex; justify-content:space-between;}
.perExpCont .emo02Exp .emoList {width:50%; display:flex; gap:5.6% 1.5%; flex-wrap:wrap;}
.perExpCont .emo02Exp .emoList a {display:block; width:calc(50% - 0.75%); position:relative;}
.perExpCont .emo02Exp .emoList a:after {content:''; display:block; height:auto; padding-bottom:87.43%;}
.perExpCont .emo02Exp .emoList a.emo01 {background:url(../img/emo01_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo02 {background:url(../img/emo02_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo03 {background:url(../img/emo03_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo04 {background:url(../img/emo04_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo01.on {background:url(../img/emo01_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo02.on {background:url(../img/emo02_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo03.on {background:url(../img/emo03_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoList a.emo04.on {background:url(../img/emo04_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoZoom {position:relative; width:36%; background:url(../img/emo_big_empty.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .emo02Exp .emoZoom:after {content:''; display:block; height:auto; padding-bottom:125%;}
.perExpCont .emo02Exp .emoZoom img {display:none; position:absolute; left:0; top:0; width:100%; height:100%;}

.perExpCont .instExp {position:absolute; left:7%; bottom:10.5%; width:calc(100% - 9.9%); display:flex; justify-content:space-between;}
.perExpCont .instExp .instList {width:64%; display:flex; gap:3% 2.2%; flex-wrap:wrap;}
.perExpCont .instExp .instList a {display:block; width:calc(50% - 1.1%); position:relative;}
.perExpCont .instExp .instList a:after {content:''; display:block; height:auto; padding-bottom:60.55%;}
.perExpCont .instExp .instList a.inst01 {background:url(../img/inst01_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst02 {background:url(../img/inst02_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst03 {background:url(../img/inst03_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst04 {background:url(../img/inst04_off.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst01.on {background:url(../img/inst01_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst02.on {background:url(../img/inst02_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst03.on {background:url(../img/inst03_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instList a.inst04.on {background:url(../img/inst04_on.svg) no-repeat 50% 50%; background-size:100%;}
.perExpCont .instExp .instZoom {position:absolute; right:0; bottom:0; width:calc(100% - 64%); height:100%;}
.perExpCont .instExp .instZoom img {display:none; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:contain;}
.perExpCont .instExp .instZoom .instChar00 {display:block; width:80%; left:8%;}
.perExpCont .instExp .instZoom .instChar04 {width:86%; left:8%;}

.perExpCont .eqExp {position:absolute; left:3.5%; top:12%; width:calc(100% - 7%); border-radius:24px 24px 0 0; overflow:hidden;}
.perExpCont .eqExp .vodSec {position:relative;}
.perExpCont .eqExp .vodSec:after {content:''; display:block; height:auto; padding-bottom:31.5625%;}
.perExpCont .eqExp .vodSec video {position:absolute; left:0; top:0; width:100%; height:100%;}
.perExpCont .eqExp .vodSec .vodFunc {position:absolute; left:0.5%; bottom:0; width:5.5%; height:20%; z-index:10;}
.perExpCont .eqExp .vodSec .vodFunc a {position:absolute; left:0; top:0; width:100%; height:100%; background:transparent;}
.perExpCont .eqExp .vodSec .vodFunc a.pause {display:none;}
.perExpCont .eqExp .instrument {margin:0 auto 0; width:58%; padding:4%; background:url(../img/eq_bg.svg) no-repeat 50% 50%; background-size:100%; display:flex;}
.perExpCont .eqExp .instrument a {display:flex; justify-content:center; align-items:center; width:50%; height:auto;}
.perExpCont .eqExp .instrument a img {width:70%;}

.rcpBox {position:relative; background:url(../img/poster_rcp.png) no-repeat 50% 50%; background-size:100%;}
.rcpBox:after {content:''; display:block; height:auto; padding-bottom:69.56%;}
.rcpBox video {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:auto;}
.rcpBox .vodFunc {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100px; height:100px; z-index:10;}
.rcpBox .vodFunc a {display:block; width:100%; height:100%;}
.rcpBox .vodFunc a.btnPlay {background:url(../img/ico_play.svg) no-repeat 50% 50%; background-size:100%;}
.rcpBox .vodFunc a.btnPause {background:url(../img/ico_pause.svg) no-repeat 50% 50%; background-size:100%; display:none;}

.expSec .seTitle {opacity:1;}
.expSec .seDesc {opacity:1;}

.comnTab {display:flex; justify-content:center; align-items:center; gap:10px;}
.comnTab a {display:block; padding:12px 68px; color:#FFF; font-size:20px; font-weight:800; border-radius:100px; background:#9395FF;}
.comnTab a.on {background:#423CB1;}

.section.cont02 {background:#FFFBEC url(../img/sec02_bg.svg) no-repeat center top 16%; padding-bottom:110px;}
.section.cont02 .innerCon.short {padding-bottom:0;}
.section.cont02 .pTitleSec {margin-bottom:80px;}
.section.cont02 .imgSec {}
.section.cont02 .imgSec img {border-radius:24px;}

.previewBox {position:relative; overflow:hidden;}
.previewBox .innerCon {max-width:900px; padding:0;}
.previewBox .prvCont {display:none; margin-top:30px;}
.previewBox .prvCont .prv-prev {position:absolute; left:-28px; top:50%; transform:translate(0, -50%) rotate(180deg); width:50px; height:50px; background:url(../img/dir_on.svg) no-repeat 50% 50%; background-size:100%; z-index:10; cursor:pointer;}
.previewBox .prvCont .prv-next {position:absolute; right:-28px; top:50%; transform:translate(0, -50%); width:50px; height:50px; background:url(../img/dir_on.svg) no-repeat 50% 50%; background-size:100%; z-index:10; cursor:pointer;}
.previewBox .prvCont .swiper-button-disabled {background:url(../img/dir_off.svg) no-repeat 50% 50%; background-size:100%;}
.previewBox .prvCont .perTxt {margin:40px 0; padding:0px; height:157px; display:flex; align-items:center; justify-content:center; flex-direction:column;}
.previewBox .prvCont .perTxt .ptTitle {color:#252525; font-size:30px; font-weight:800; line-height:1.4; text-align:center;}
.previewBox .prvCont .perTxt ul {display:flex; flex-direction:column; margin-top:20px; gap:10px; padding:0 6px;}
.previewBox .prvCont .perTxt ul li {display:flex; align-items:center; gap:8px; position:relative;}
.previewBox .prvCont .perTxt ul li p {color:#252525; font-size:18px; line-height:1.4;}
.previewBox .prvCont .perTxt ul li p em {color:#423CB1; font-size:18px; font-weight:800;}
.previewBox .prvCont .perTxt ul li:before {content:''; width:14px; height:22px; background:url(../img/ico_item.svg) no-repeat 50% 50%; background-size:100%; transform:translateY(-3px);}
.previewBox .prvCont .perTxt ul li p strong {font-weight:700;}

.previewBox .swiper-container.preview {overflow:visible;}
.previewBox .swiper-slide .inSlide {background:#423CB1; border-radius:20px; padding:30px;}
.previewBox .swiper-slide img {display:block; width:100%; border-radius:18px;}
.previewBox .swiper-slide {width:100%; opacity:0.2; transform:scale(0.85); transition:.4s all;}
.previewBox .swiper-slide.swiper-slide-active {opacity:1.0; transform:scale(1.0);}
.previewBox .swiper-slide.swiper-slide-prev {opacity:0.2; transform:scale(.86) translateX(40px);}
.previewBox .swiper-slide.swiper-slide-next {opacity:0.2; transform:scale(.86) translateX(-40px);}

.section.cont03 {background:#FFE2E8;}
.qrBox {width:100%; max-width:300px; margin:0 auto; text-align:center;}
.qrBox .inQr {position:relative; background:#FFF;}
.qrBox .inQr a {display:block; padding:40px 64px 30px;}
.qrBox .inQr a .txt {display:flex; justify-content:center; align-items:center; flex-direction:column; gap:4px; margin-top:12px; position:relative; color:#000; font-size:14px;}
.qrBox .inQr a .txt:before {content:''; width:30px; height:30px; background:url(../img/ico_zoom.svg) no-repeat 50% 50%; background-size:100%;}
.qrBox > a {display:inline-flex; align-items:center; gap:6px; position:relative; color:#252525; font-size:20px; font-weight:800; margin-top:30px;}
.qrBox > a:after {content:''; width:16px; height:16px; background:url(../img/ar_tail.svg) no-repeat 50% 50%; background-size:100%;}

.stepCont {position:relative; display:flex; flex-direction:column; gap:20px; margin-top:40px;}
.stepCont .perStepBox {display:flex; align-items:center; gap:70px; position:relative; background:#FFF; border-radius:30px; padding:40px; z-index:10;}
.stepCont .perStepBox .imgSec {width:26%; flex:0 0 auto;}
.stepCont .perStepBox .txtSec {width:calc(74% - 70px);}
.stepCont .perStepBox .txtSec .stepTitle {color:#000; font-size:30px; font-family:'YeogiOttaeJalnan'; line-height:1.4;}
.stepCont .perStepBox .txtSec .stepTitle em {color:#423CB1; font-size:30px; font-family:'YeogiOttaeJalnan';}
.stepCont .perStepBox .txtSec .stepTitle br {display:none;}
.stepCont .perStepBox .txtSec .txt {margin-top:20px; color:#252525; font-size:20px; font-weight:800;}
.stepCont .perStepBox .txtSec .stepNotes {display:flex; flex-direction:column; gap:10px; margin-top:40px;}
.stepCont .perStepBox .txtSec .stepNotes li {display:flex; gap:8px; position:relative; color:#252525; font-size:18px; line-height:1.4;}
.stepCont .perStepBox .txtSec .stepNotes li span {color:#423CB1; font-size:18px; font-weight:800; line-height:1.4;}
.stepCont .perStepBox .txtSec .stepNotes li:before {content:''; width:14px; height:22px; background:url(../img/ico_item.svg) no-repeat 50% 50%; background-size:100%; transform:translateY(-3px);}
.stepCont .perStepBox .txtSec .stepNotes li.plat {margin-top:10px;}
.stepCont .perStepBox .txtSec .stepNotes li.plat:before {display:none;}

.stepCont .char {position:absolute; top:-186px; width:276px; height:auto;}
.stepCont .char.left {left:-137px;}
.stepCont .char.right {right:-142px;}

.section.cont04 {background:#FFFADC;}
.section.cont04 .innerCon {text-align:center;}
.recomnTitle {display:inline-block; color:#000; font-size:60px; font-family:'YeogiOttaeJalnan'; line-height:1.4; margin-bottom:80px;}
.recomnTitle > img {width:auto; height:80px;}
.recomnTitle span {color:#76A62E; font-size:60px; font-family:'YeogiOttaeJalnan';}
.recomnBox {display:flex; align-items:stretch; gap:24px;}
.recomnBox .perReComn {width:calc(50% - 12px); background:#FFF; border-radius:32px; padding:95px 30px 104px; box-shadow: 1px 6px 11px 0 #DDD9C6; text-align:center; position:relative;}
.recomnBox .perReComn:after {content:''; position:absolute; left:50%; top:-30px; transform:translate(-50%, 0); width:48px; height:64px; background:url(../img/deco_pin.svg) no-repeat 50% 50%; background-size:100%;}
.recomnBox .perReComn .char {position:absolute;}
.recomnBox .perReComn .char.left {left:-70px; bottom:-44px; width:170px;}
.recomnBox .perReComn .char.right {right:-44px; bottom:-95px; width:200px;}
.recomnBox .perReComn .prTitle {color:#76A62E; font-size:24px; line-height:1.5; font-family:'YeogiOttaeJalnan'; margin-bottom:30px; height:114px; display:flex; justify-content:center;}
.recomnBox .perReComn .txt {padding:0 0 60px; color:#252525; font-size:18px; line-height:1.6;}
.recomnBox .perReComn .writer {position:absolute; left:0; bottom:105px; text-align:center; color:#252525; font-size:20px; font-weight:800; line-height:1.3; width:100%;}

.recomnBox .perReComn:last-child .char.left {left:-17px; bottom:-49px; width:186px;}
.recomnBox .perReComn:last-child .char.right {right:-102px; bottom:-82px; width:200px;}

.qrPop {position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; max-width:600px; height:auto; padding:124px; background:#FFF; z-index:3000; display:none;}
.qrPop .popClose {position:absolute; right:-45px; top:-45px; width:40px; height:40px; background:url(../img/ico_close.svg) no-repeat 50% 50%; cursor:pointer;}



@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:1024px) {
	.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:0; 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;}

	/*********** 개별 이벤트  **************/
	.innerCon {padding:60px 0;}
	.evHead {overflow:hidden; background-size:100% auto;}
	.evHead:before {left:0; width:30%; height:40%; top:80px; transform:none; background-size:auto 100%;}
	.evHead:after {right:0; width:30%; height:40%; top:80px; transform:none; background-size:auto 100%;}
	.evHead .logoPartner {width:140px;}
	.evHead .innerCon {padding:70px 0 26px;}
	.evHead .round {height:28px; margin:10px 0 15px;}
	.evHead .round p {font-size:16px;}
	.evHead .round:before {width:18px; left:-16px; height:28px; background-size:auto 100%;}
	.evHead .round:after {height:28px; background-size:auto 100%;}
	.evHead h2 {padding:0 30px;}
	.evHead .headCont {padding:0 20px; margin:20px 0;}
	.evHead .headCont .inCont {width:320px; height:334px; background:url(../img/head_note_mo.svg); padding-top:34px;}
	.evHead .headCont .inCont .title {font-size:20px;}
	.evHead .headCont .inCont .title em {display:block; font-size:24px;}
	.evHead .headCont .inCont .desc {margin:12px 0;}
	.evHead .headCont .inCont .desc strong {font-size:16px;}
	.evHead .headCont .inCont .desc p {font-size:14px;}
	.evHead .headCont .inCont .headTags {flex-wrap:wrap; padding:0 30px;}
	.evHead .headCont .inCont .headTags span {font-size:12px; padding:6px 12px 6px 6px; gap:4px;}
	.evHead .headCont .inCont .headTags span:before {width:20px; height:20px;}
	.evHead .headCont .deco01 {bottom:-16px; left:-30px; width:146px;}
	.evHead .headCont .deco02 {bottom:-16px; right:-30px; width:146px;}
	.evHead .headCau {font-size:12px; padding:0 20px;}
	.evHead .headCau em {font-size:12px;}
	.evHead .piano {height:60px; background-size:auto 60px;}

	.section .pTitleSec {margin-bottom:35px;}
	.section .pTitleSec .pTitle {font-size:26px; line-height:1.6;}
	.section .pTitleSec .pTitle em {display:block; font-size:26px;}
	.section .pTitleSec .pTitle .partRound {width:30px; height:32px; font-size:13px; padding-top:10px; left:-16px; top:-20px;}
	.section .pTitleSec .pDesc {font-size:16px;}
	.section .pTitleSec .pDesc em {font-size:16px;}
	
	.section.cont01 .innerCon {padding:60px 0 0;}

	.expSec {border-radius:0; padding:40px 20px 60px;}
	.comnTab {gap:4px;}
	.comnTab a {flex:1; font-size:14px; padding:8px 0; text-align:center;}

	.expSec .expCont .inExpTitle .seTitle {font-size:18px;}
	.expSec .expCont .inExpTitle .seDesc {font-size:14px;}
	.expSec .expCont .perExp {border-radius:10px; padding:10px;}
	.perExpCont {border-radius:6px;}
	.expSec .expCont .inExpTitle {margin:30px 0 20px;}
	.expSec .expCont .exp-prev {top:66%; width:30px; height:30px; left:-15px;}
	.expSec .expCont .exp-next {top:66%; width:30px; height:30px; right:-15px;}
	.expSec .expCont .expPaging {bottom:-18px; gap:4px;}
	.expSec .expCont .expPaging .swiper-pagination-bullet {width:8px; height:8px;}

	.section.cont02 {overflow-x:hidden; padding-bottom:60px;}
	.section.cont02 .pTitleSec {margin-bottom:40px;}
	.section.cont02 .innerCon {padding:60px 20px 40px;}
	.section.cont03 {overflow-x:hidden;}
	.section.cont03 .innerCon {padding:60px 20px;}

	.section.cont02 .imgSec {padding:0px; border-radius:0px;}
	.section.cont02 .imgSec img {border-radius:6px;}

	.previewBox {margin:0;}
	.section.cont02 .previewBox .innerCon {padding:0 20px;}
	.previewBox .swiper-slide .inSlide {padding:10px; border-radius:10px;}
	.previewBox .swiper-slide img {border-radius:6px;}

	.previewBox .prvCont .prv-prev {width:30px; height:30px; left:-15px;}
	.previewBox .prvCont .prv-next {width:30px; height:30px; right:-15px;}

	.previewBox .prvCont .perTxt {margin-top:20px; padding:0; height:203px;}
	.previewBox .prvCont .perTxt .ptTitle {text-align:center; font-size:16px;}
	.previewBox .prvCont .perTxt ul li {align-items:flex-start;}
	.previewBox .prvCont .perTxt ul li p {font-size:14px;}
	.previewBox .prvCont .perTxt ul li:before {flex:0 0 auto; width:12px;}

	.rcpBox .vodFunc {width:50px; height:50px; display:none;}

	.qrBox {padding:0 80px; max-width:100%;}
	.qrBox .inQr a {padding:18px 28px 18px;}
	.qrBox > a {font-size:16px;}
	.qrBox > a:after {flex:0 0 auto;}

	.stepCont .char {width:102px; height:102px;}
	.stepCont .char.left {left:-30px; top:-80px;}
	.stepCont .char.right {right:-30px; top:-80px;}

	.stepCont .perStepBox {border-radius:10px; align-items:flex-start; flex-direction:column; padding:16px 16px 28px; gap:22px;}
	.stepCont .perStepBox .imgSec {width:160px; flex:0 0 auto;}
	.stepCont .perStepBox .txtSec {width:100%; margin-top:0;}
	.stepCont .perStepBox .txtSec .stepTitle {position:absolute; left:190px; top:60px; font-size:18px; width:calc(100% - 190px); padding-right:16px;}
	.stepCont .perStepBox .txtSec .stepTitle em {font-size:18px; display:block; margin-bottom:6px;}
	.stepCont .perStepBox .txtSec .txt {font-size:16px; line-height:1.4; margin-top:0; margin-bottom:16px;}
	.stepCont .perStepBox .txtSec .stepNotes {margin-top:0px;}
	.stepCont .perStepBox .txtSec .stepNotes li {font-size:14px; align-items:flex-start;}
	.stepCont .perStepBox .txtSec .stepNotes li:before {flex:0 0 auto; width:12px;}
	.stepCont .perStepBox .txtSec .stepNotes li.plat {margin-top:0px;}
	.stepCont .perStepBox .txtSec .stepNotes li.plat a img {width:160px;}

	.section.cont04 {overflow:hidden;}
	.section.cont04 .innerCon {padding:60px 20px;}
	.recomnTitle {font-size:24px; margin-bottom:40px;}
	.recomnTitle img {height:32px;}
	.recomnTitle span {font-size:24px;}
	.recomnBox {align-items:flex-start; flex-direction:column; gap:40px;}
	.recomnBox .perReComn {width:100%; border-radius:12px; padding:42px 12px;}
	.recomnBox .perReComn:after {width:18px; height:21px; top:-6px;}
	.recomnBox .perReComn .prTitle {font-size:18px; height:auto; margin-bottom:20px;}
	.recomnBox .perReComn .txt {font-size:14px; padding-bottom:0;}
	.recomnBox .perReComn .writer {position:relative; left:unset; bottom:unset; margin-top:30px; font-size:14px;}
	.recomnBox .perReComn .char.left {width:82px; left:-26px; bottom:-30px;}
	.recomnBox .perReComn .char.right {width:96px; right:-40px; bottom:-30px;}
	.recomnBox .perReComn:last-child .char.left {width:86px; left:-16px; bottom:-36px;}
	.recomnBox .perReComn:last-child .char.right {width:95px; right:-20px; bottom:-42px;}

	.qrPop {width:90%; padding:50px;}
	.qrPop .popClose {right:0px; background-size:24px;}

	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:768px) {

}

@media only screen and (max-width:420px) {

}