@charset "UTF-8";

/**
* Filename :style.css
* Description :THE EVERLAND OF OZ : X-MAS FANTASY pick styles
**/

/* 학교안심 마법사 */
@font-face {
	font-family:'TTHakgyoansimMabeopsaR';
	src:url('https://wwwrod.everland.com/font/TTHakgyoansimMabeopsaR.woff2') format('woff2');
	font-weight:normal;
	font-style:normal;
}

/* 학교안심 시간표 */
@font-face {
	font-family:'HakgyoansimSiganpyoR';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2508-2@1.0/HakgyoansimSiganpyoR.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}

/* Pretendard */
@font-face {
	font-family:'Pretendard';
	src:url('https://wwwrod.everland.com/font/Pretendard/Pretendard-Regular.woff2') format('woff2');
	font-weight:normal;
	font-style:normal;
}

/* base */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, menu, nav, section, main, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; box-sizing:border-box; background:transparent; }
html, body { width:100%; scroll-behavior:smooth; }
html { font-size:10px; }
body { font-family:'Pretendard', sans-serif; color:#333; text-align:center; word-wrap:break-word; word-break:keep-all; }
ul, ol { list-style-type:none; }
a { box-sizing:border-box; color:#333; text-decoration:none; cursor:pointer; }
a:hover, a:active { text-decoration:none; }
em, i { font-style:normal; }
button { margin:0; padding:0; box-sizing:border-box; border:0 none; background-color:transparent; vertical-align:middle; color:#333; font-family:'Pretendard', sans-serif; cursor:pointer; outline:none; }
figcaption { display:none; }
img { width:100%; vertical-align:top; }
area { cursor:pointer; }
.hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); border:0; }
.body-stop { overflow:hidden; }
::-webkit-scrollbar { width:4px; background-color:transparent; -webkit-appearance:none; }
::-webkit-scrollbar:vertical { width:4px; background-color:transparent; }
::-webkit-scrollbar-button { width:0; height:15px; }
::-webkit-scrollbar-button:end:increment { height:50px; }
::-webkit-scrollbar-track { background-color:transparent; }
::-webkit-scrollbar-thumb { background-color:#9da0a1; border-radius:1rem; opacity:.5; }


/* layout */
.wrapper { position:relative; overflow:hidden; }
.wrapper .title { width:100%; max-width:36rem; margin:0 auto; }
.btn-logo { position:absolute; top:2rem; left:1.3rem; width:8.2rem; height:5.1rem; background:url('../img/btn-logo.png') no-repeat center; background-size:100% auto; font-size:0; }
.btn-menu { position:fixed; top:0; right:1.6rem; z-index:3; width:4.5rem; height:7rem; background:url('../img/btn-menu.png') no-repeat center; background-size:100% auto; font-size:0; transform-origin:center top; transform:rotateZ(-1deg); animation:menu 1s ease-in-out 0s infinite alternate; }
.btn-top { display:none; position:fixed; z-index:8; right:calc(50% - 18rem + 1.8rem); bottom:1.2rem; width:5.1rem; height:5.1rem; background:url('../img/btn-top.png') no-repeat center; background-size:100% auto; color:transparent; font-size:0; text-indent:-9999px; }
@keyframes menu {
	0% { transform:rotateZ(-1deg); }
	100% { transform:rotateZ(2deg); }
}


nav { overflow:hidden; display:none; position:fixed; left:0; top:0; right:0; bottom:0; z-index:4; width:100%; max-width:720px; height:100%; margin:auto; }
nav .menu { overflow-x:hidden; overflow-y:auto; display:flex; flex-wrap:wrap; align-content:space-between; position:absolute; top:0; right:0; bottom:0; width:100%; height:100%; background:#008047 url('../img/bg-menu1.jpg') no-repeat left top; background-size:100% auto; }
nav .menu::-webkit-scrollbar { display:none; }
nav .menu.emerald { background:url('../img/bg-menu1.jpg') no-repeat left top; background-size:100% auto; }
nav .menu.food { background:url('../img/bg-menu2.jpg') no-repeat left top; background-size:100% auto; }
nav .menu.gift { background:url('../img/bg-menu3.jpg') no-repeat left top; background-size:100% auto; }
nav .menu-inner { flex:1; width:100%; }
nav .menu .obj-menu { display:flex; justify-content:flex-end; align-items:center; position:relative; width:100%; background-image:url('../img/obj-menu1-btm.png'); background-repeat:no-repeat; background-size:100% auto; background-position:center bottom; aspect-ratio:360 / 231; }
nav .menu.emerald .obj-menu { margin-top:1.4rem; background-image:url('../img/obj-menu1-btm.png'); }
nav .menu.food .obj-menu { background-image:url('../img/obj-menu2-btm.png'); }
nav .menu.gift .obj-menu { margin-top:-4.9rem; background-image:url('../img/obj-menu3-btm.png'); }
nav .menu .logo { width:19rem; margin:4.8rem auto 3.3rem; }
nav .menu .logo > a { display:block; }
nav .menu .btn-close { position:absolute; top:0; right:1.8rem; z-index:13; width:5.1rem; height:7.4rem; background:url('../img/btn-menu-close.png') no-repeat center; background-size:100% auto; color:transparent; font-size:0; text-indent:-9999px; transform-origin:center top; transform:rotateZ(-1deg); animation:menu 1s ease-in-out 0s infinite alternate; }
nav .menu .depth { margin:0 8.33vw; box-shadow:0px 0px .5rem 0px rgba(0, 0, 0, 0.2); }
nav .menu .depth > li.on::before,
nav .menu .depth > li.on::after { content:''; position:absolute; z-index:1; background-repeat:no-repeat; background-position:center; background-size:100% auto; transition:.3s; }
nav .menu .depth > li { position:relative; z-index:13; background-repeat:no-repeat; background-position:center top; background-size:100% auto; }
nav .menu .depth > li > a { display:flex; align-items:center; justify-content:flex-start; position:relative; padding:1rem 1.5rem; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
nav .menu .depth > li > a::before,
nav .menu .depth > li > a::after { content:''; position:absolute; background-repeat:no-repeat; background-size:100% auto; }
nav .menu .depth > li > a::before { top:-1.94vw; left:50%; width:86.39vw; height:3.89vw; background-position:center; transform:translateX(-50%); }
nav .menu .depth > li > a::after { right:2.6rem; width:2rem; height:1.7rem; transition:.3s; }
nav .menu .depth > li > a img { width:20rem; }
nav .menu .depth > li.on > a::after { transform:rotateZ(180deg); }
nav .menu .sub-depth { display:none; position:relative; padding:2rem 3.7rem; background-repeat:repeat-y; background-size:100% auto; }
nav .menu .sub-depth a[data-type="line"] { display:block; position:absolute; top:0; right:0; left:0; width:22.7rem; margin:0 auto; background-repeat:no-repeat; background-position:center; background-size:100% auto; color:transparent; text-indent:-9999px; }
nav .menu .sub-depth ul > li > a { display:block; position:relative; z-index:1; padding:1.2rem 0 1.2rem .7rem; font-size:1.6rem; line-height:2.1rem; letter-spacing:-0.02em; text-align:left; text-indent:-.7rem; }
nav li[data-txt="emerald"] > a { background-image:url('../img/bg-menu1.png'); }
nav li[data-txt="emerald"] > a::before { background-image:url('../img/obj-menu1.png'); }
nav li[data-txt="emerald"] > a::after { background-image:url('../img/ico-menu1-arrow.png'); }
nav li[data-txt="emerald"] .sub-depth { background-image:url('../img/bg-sub-menu1.jpg'); }
nav li[data-txt="emerald"] .sub-depth::before { content:''; position:absolute; top:1.5rem; left:calc(50% - 15rem + 2.2rem); width:2.5rem; height:2.6rem; background:url('../img/obj-sub-menu1-snow.png') no-repeat center; background-size:100% auto; }
nav li[data-txt="emerald"] .sub-depth .city { position:relative; padding-top:8rem; }
nav li[data-txt="emerald"] .sub-depth .city .btn-city { background-image:url('../img/line-emerald-city.png'); aspect-ratio:227 / 73; }
nav li[data-txt="emerald"] .sub-depth .city li a { color:#b9ffb9; }
nav li[data-txt="emerald"] .sub-depth .photo { position:relative; padding-top:4.3rem; margin-top:2.3rem; }
nav li[data-txt="emerald"] .sub-depth .photo li a { color:#b3f5d7; }
nav li[data-txt="emerald"] .sub-depth .photo .btn-photo { background-image:url('../img/line-emerald-photo.png'); aspect-ratio:227 / 36; }
nav li[data-txt="food"] > a { background-image:url('../img/bg-menu2.png'); }
nav li[data-txt="food"] > a::before { background-image:url('../img/obj-menu2.png'); }
nav li[data-txt="food"] > a::after { background-image:url('../img/ico-menu2-arrow.png'); }
nav li[data-txt="food"] .sub-depth { background-image:url('../img/bg-sub-menu2.jpg'); }
nav li[data-txt="food"] .sub-depth > ul > li > a { color:#ffd52e; }
nav li[data-txt="gift"] > a { background-image:url('../img/bg-menu3.png'); }
nav li[data-txt="gift"] > a::before { background-image:url('../img/obj-menu3.png'); }
nav li[data-txt="gift"] > a::after { background-image:url('../img/ico-menu3-arrow.png'); }
nav li[data-txt="gift"] .sub-depth { background-image:url('../img/bg-sub-menu3.jpg'); }
nav li[data-txt="gift"] .sub-depth > ul > li > a { color:#7d3912; }
nav .menu.emerald li[data-txt="emerald"]::before { top:19.9rem; right:calc(50% - 15rem - 1.7rem); width:8.6rem; height:8.2rem; background-image:url('../img/obj-sub-menu1-airballoon.png'); }
nav .menu.emerald li[data-txt="emerald"]::after { top:79.5rem; right:calc(50% - 15rem + .9rem); width:6.9rem; height:6.1rem; background-image:url('../img/obj-sub-menu1-toto.png'); }
nav .menu.food li[data-txt="food"]::before { top:13.6rem; right:calc(50% - 15rem - 1.4rem); width:9.6rem; height:8.6rem; background-image:url('../img/obj-sub-menu2-cane.png'); }
nav .menu.gift li[data-txt="gift"]::before { top:9.9rem; right:calc(50% - 15rem - 1.6rem); width:8.7rem; height:9.1rem; background-image:url('../img/obj-sub-menu3-bag.png'); }


footer { display:flex; justify-content:flex-start; align-items:center; position:absolute; bottom:3rem; left:2rem; }
footer .item.logo { width:2.5rem; height:2.3rem; margin-right:.9rem; }
footer .item.copy { width:5.4rem; height:.9rem; }


/* swiper */
.swiper-pagination-bullets.swiper-pagination-horizontal { display:flex; justify-content:center; align-items:center; position:relative; right:auto; bottom:auto; left:auto; width:auto; margin-top:-.3rem; z-index:0; }
.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet { width:1.1rem; height:1.1rem; margin:0 .5rem; background:url('../img/ico-pagination.png') no-repeat center; background-size:100% auto; opacity:1; }
.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet-active { width:1.6rem; height:1.6rem; background-image:url('../img/ico-pagination-active.png'); }
.swiper-button-prev,
.swiper-button-next { position:absolute; margin:0; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
.swiper-button-prev:after, 
.swiper-button-next:after { display:none; }

/* slick */
.slick-dots { position:absolute; left:50%; bottom:1rem; transform:translateX(-50%); z-index:1; }
.slick-dots li { display:inline-block; width:1rem; height:1rem; margin:0 .3rem; border-width:1px; border-style:solid; border-radius:50%; background:#FFF; text-indent:-9999px; cursor:pointer; box-sizing:border-box; }
.slick-dots li.slick-active { border-color:#333; }


/* popup */
.popup { display:none; justify-content:center; align-items:center; position:fixed; top:0; right:0; bottom:0; left:0; z-index:9; max-width:720px; margin:auto; background-color:rgba(0, 0, 0, .7); transition:.3s; }
.popup.active { display:flex; }
.popup .content-wrap { overflow-y:auto; flex:1; position:relative; width:100%; max-width:36rem; height:100%; }
.popup .content-wrap::-webkit-scrollbar { display:none; }
.popup .content-wrap .inner-wrap { display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; min-height:100%; padding:1rem 0; }
.popup .content-wrap .swiper-slide { width:100%; }
.popup .content { display:flex; flex-direction:column; justify-content:flex-start; align-items:center; width:100%; padding:4.1rem 3rem 0; margin-top:1.8rem; background-repeat:no-repeat; background-position:top center; background-size:100% auto; }
.popup .btn-close { display:block; width:3.4rem; height:3.3rem; min-height:3.3rem; margin-left:calc(36rem - 3.4rem - 4rem); background:url('../img/btn-popup-close.png') no-repeat center; background-size:100% auto; color:transparent; text-indent:-9999px; }


/* content */
.sec { position:relative; }
.sec h4 { width:100%; max-width:36rem; margin:0 auto; }
.sec p { position:relative; font-size:1.4rem; font-weight:500; line-height:2.1rem; letter-spacing:-.7px; }
.sec .swiper-slide { position:relative; }
.sec .list-info { display:flex; justify-content:center; }
.sec .list-info > ul li { position:relative; padding-left:1.9rem; font-size:1.4rem; font-weight:500; line-height:1.9rem; letter-spacing:-.7px; text-align:left; }
.sec .list-info > ul li::before { content:''; position:absolute; top:0; left:0; width:1.5rem; height:1.5rem; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
.sec .list-info > ul li + li { margin-top:.3rem; }
.sec .list-info > ul li em { display:block; font-size:1.2rem; line-height:2.1rem; letter-spacing:-.6px; }
.sec .list-info > ul li em::before { content:'*'; margin-right:.2rem; }
.sec .list-caution { display:flex; justify-content:center; }
.sec .list-caution > ul li { position:relative; padding-left:1rem; font-size:1.2rem; font-weight:500; line-height:1.7rem; letter-spacing:-.6px; }
.sec .list-caution > ul li::before { content:'*'; position:absolute; top:0; left:0; }
.obj { position:absolute; z-index:1; }
.blend.screen { mix-blend-mode:screen; }
.blend.hard-light { mix-blend-mode:hard-light; }


/* main */
#main { position:relative; z-index:2; height:128.88vw; padding-top:36.11vw; background:url('../img/bg-main.jpg') no-repeat center top; background-size:100% auto; }
#main .snow { position:relative; margin:0 auto; }
#main .snow .ball { overflow:hidden; position:relative; z-index:2; width:70.28vw; height:70.28vw; margin:0 auto; border-radius:50%; background:url('../img/obj-main-snowball.png') center no-repeat; background-size:100% auto; box-shadow: 0 0 2rem rgba(0, 0, 0, .3); }
#main .snow .ball canvas { position:relative; z-index:2; width:100%; height:100%; }
#main .snow .ball .obj:not(.snowman) img { mix-blend-mode:overlay; }
#main .snow .ball .snowman { right:11.11vw; bottom:19.17vw; width:20.56vw; transform:rotateZ(-2deg); transform-origin:center bottom; animation:snowman 1.2s ease-in-out 0s infinite alternate; }
@keyframes snowman {
	0% { transform:rotateZ(-2deg); }
	100% { transform:rotateZ(3deg); }
}
#main .snow .ball .firecracker1 { top:10.28vw; left:10vw; width:11.94vw; }
#main .snow .ball .firecracker1 img { animation:firecracker1 .6s linear 0s infinite alternate; }
#main .snow .ball .firecracker2 { top:0vw; left:15.83vw; width:18.06vw; }
#main .snow .ball .firecracker2 img { opacity:.2; animation:firecracker2 1s ease-in-out 0s infinite alternate; }
#main .snow .ball .firecracker3 { top:2.50vw; right:25vw; width:18.89vw; }
#main .snow .ball .firecracker3 img { opacity:.3; animation:firecracker3 .4s ease-in 0s infinite alternate; }
#main .snow .ball .firecracker4 { top:8.33vw; right:18.89vw; width:9.72vw; }
#main .snow .ball .firecracker4 img { animation:firecracker4 .8s ease 0s infinite alternate; }
@keyframes firecracker1 {
	0% { opacity:1; }
	100% { opacity:.3; }
}
@keyframes firecracker2 {
	0% { opacity:.2; }
	100% { opacity:1; }
}
@keyframes firecracker3 {
	0% { opacity:.3; }
	100% { opacity:1; }
}
@keyframes firecracker4 {
	0% { opacity:1; }
	100% { opacity:.2; }
}
#main .snow .bottom { position:relative; z-index:2; width:100vw; margin:-11.11vw auto 0; }
#main .snow .obj.donna { top:-3.89vw; right:calc(50% - 50vw + 9.44vw); width:27.50vw; opacity:0; transform:translate(-2.78vw, 2.78vw); animation:donna .7s ease-out 1s 1 forwards; }
@keyframes donna {
	0% { opacity:0; transform:translate(-1rem, 1rem); }
	100% { opacity:1; transform:translate(0); }
}
#main .snow .obj.bagel { top:-20.56vw; right:calc(50% - 50vw + 25.56vw); width:28.61vw; height:34.17vw; opacity:0; transform:translateY(0); animation:bagel .6s ease-in-out .6s 1 forwards; }
@keyframes bagel {
	0% { opacity:0; transform:translateY(0); }
	50% { transform:translateY(-1.5rem); }
	100% { opacity:1; transform:translateY(0); }
}
#main .snow .obj.jack { top:30.56vw; left:calc(50% - 50vw - 5vw); width:18.89vw; opacity:0; transform:translate(-2.78vw, -2.78vw); animation:jack .7s ease-in-out .8s 1 forwards; }
@keyframes jack {
	0% { opacity:0; transform:translate(-1rem, -1rem); }
	100% { opacity:1; transform:translate(0); }
}
#main .snow .obj.lenny { bottom:9.44vw; left:calc(50% - 50vw + 3.06vw); z-index:2; width:27.78vw; opacity:0; transform:translateY(0); animation:lenny .7s ease-in-out .2s 1 forwards; }
@keyframes lenny {
	0% { opacity:0; transform:translateY(0); }
	50% { transform:translateY(-1.2rem); }
	100% { opacity:1; transform:translateY(0); }
}
#main .snow .obj.toto { bottom:-4.72vw; left:calc(50% - 50vw + 32.50vw); z-index:2; width:46.39vw; height:24.44vw; }
#main .snow .obj.toto .toto { position:absolute; top:0; left:calc(50% - 23.06vw + 11.94vw); width:13.89vw; height:13.33vw; opacity:0; transform:translateY(0); animation:toto1 .6s ease-in-out .9s 1 forwards, toto2 1.4s ease-in-out 0s infinite forwards; }
@keyframes toto1 {
	0% { opacity:0; }
	100% { opacity:1; }
}
@keyframes toto2 {
	0% { transform:translateY(0); }
	50% { transform:translateY(-1rem); }
	100% { transform:translateY(0); }
}
#main .snow .obj.toto .snow { position:absolute; bottom:0; left:0; }
#main .snow .obj.lara { right:calc(50% - 50vw + 5vw); bottom:11.94vw; z-index:2; width:23.61vw; opacity:0; transform:translateX(0); animation:lara .7s ease-in-out .4s 1 forwards; }
@keyframes lara {
	0% { opacity:0; transform:translateX(0); }
	50% { transform:translateX(-1.2rem); }
	100% { opacity:1; transform:translateX(0); }
}
#main .title { position:absolute; top:49.44vw; right:0; left:0; z-index:2; width:100vw; }
#main .title img { opacity:0; transform:translateY(-1.5rem); animation:title 1.4s ease-in-out 1.2s 1 forwards; }
@keyframes title {
	0% { opacity:0; transform:translateY(-1.5rem); }
	100% { opacity:1; transform:translateY(0); }
}
#main .title::after { content:''; position:absolute; top:-6.39vw; right:0; left:0; width:100%; height:100%; background:url('../img/obj-main-tit.png') no-repeat center; background-size:100% auto; }
#main .wreath { position:absolute; right:0; bottom:-24.17vw; left:0; z-index:3; margin:0 auto; }
#main .coach-mark { display:block; position:fixed; top:152.78vw; right:0; left:0; z-index:3; width:10vw; height:5.83vw; margin:0 auto; background:url('../img/ico-scroll.png') no-repeat center; background-size:100% auto; text-indent:-9999px; }
#snow { position:absolute; top:0; right:0; bottom:0; left:0; z-index:3; max-width:720px; margin:0 auto; }


/* map */
#map { position:relative; padding:0; background:url('../img/bg-map.jpg') no-repeat center top; background-size:100% auto; aspect-ratio:360 / 636; }
#map .obj.lenny { top:37.22vw; left:calc(50% - 50vw + 3.61vw); width:18.06vw; height:24.72vw; }
#map .obj.lenny img { position:absolute; top:0; left:0; }
#map .obj.lenny .glitter { opacity:1; animation:glitter .5s ease 0s infinite alternate; }
@keyframes glitter {
	0% { opacity:1; }
	100% { opacity:.5; }
}
#map .obj.lara { top:calc(50% - 88.33vw + 88.33vw); right:calc(50% - 50vw + 8.61vw); width:15.56vw; height:13.61vw; }
#map .obj.glasses { bottom:21.94vw; left:calc(50% - 50vw + 9.44vw); width:19.44vw; transform:rotateZ(0); animation:glasses 1.4s ease-in-out 0s infinite alternate; }
@keyframes glasses {
	0% { transform:rotateZ(0); }
	100% { transform:rotateZ(5deg); }
}
#map .list { position:relative; height:100%; }
#map .list li { position:absolute; }
#map .list li a { display:block; position:relative; width:100%; height:100%; }
#map .list li img { position:absolute; right:0; }
#map .list .emerald { top:23.89vw; right:calc(50% - 50vw - 6.67vw); width:73.06vw; height:51.11vw; }
#map .list .emerald .spotlight { opacity:.2; animation:emerald 1s ease-in-out 0s infinite alternate; }
#map .list .emerald .glitter { opacity:.2; animation:emerald .4s ease-in 0s infinite alternate; }
@keyframes emerald {
	0% { opacity:.2; }
	100% { opacity:1; }
}
#map .list .food { top:calc(50% - 88.33vw + 71.67vw); left:calc(50% - 50vw + 2.22vw); width:54.44vw; height:36.39vw; }
#map .list .food .glitter1 { opacity:1; animation:food1 .8s ease-in -.4s infinite alternate; }
#map .list .food .glitter2 { opacity:.2; animation:food2 .4s ease-in .2s infinite alternate; }
#map .list .food .glitter3 { opacity:.2; animation:food2 1s ease-in 0s infinite alternate; }
@keyframes food1 {
	0% { opacity:1; }
	100% { opacity:.3; }
}
@keyframes food2 {
	0% { opacity:.2; }
	100% { opacity:1; }
}
#map .list .food .snow-area { position:absolute; top:0; left:3.33vw; width:46.94vw; height:30.28vw; }
#christmasMenu { position:absolute; top:0; left:3.33vw; }
#map .list .gift { right:calc(50% - 50vw + 3.89vw); bottom:27.78vw; width:66.39vw; height:50.83vw; }
#map .list .gift .spotlight { opacity:1; animation:gift1 1.2s ease-in-out 0s infinite alternate; }
#map .list .gift .glitter { opacity:.5; animation:gift2 1.6s ease-out 0s infinite alternate; }
@keyframes gift1 {
	0% { opacity:1; }
	100% { opacity:.2; }
}
@keyframes gift2 {
	0% { opacity:.5; }
	100% { opacity:1; }
}


/* emerald */
#emerald { padding-top:26.39vw; background:url('../img/bg-emerald.jpg') no-repeat center top; background-size:100% auto; }

#emerald > .map { padding:2.2rem 0 1.4rem; }
#emerald > .map::before { content:''; position:absolute; top:1.2rem; left:calc(50% - 18rem + 4.3rem); width:2.6rem; height:2.6rem; background:url('../img/obj-emerald-map-snow.png') no-repeat center; background-size:100% auto; }
#emerald > .map::after { content:''; position:absolute; top:-3.8rem; right:calc(50% - 18rem + .8rem); width:7rem; height:9.8rem; background:url('../img/obj-emerald-map-bagel.png') no-repeat center; background-size:100% auto; }
#emerald > .map .con { position:relative; z-index:2; width:100%; max-width:36rem; margin:.5rem auto 0; background:url("../img/img-emerald-map.png") no-repeat center; background-size:100% auto; aspect-ratio:360 / 529; }
#emerald > .map .con::before { content:''; position:absolute; top:4.4rem; right:calc(50% - 18rem + 4.4rem); width:4rem; height:3.7rem; background:url('../img/obj-emerald-map-santa.png') no-repeat center; background-size:100% auto; }
#emerald > .map .con::after { content:''; position:absolute; bottom:-2.5rem; right:calc(50% - 18rem - 1.5rem); width:14.8rem; height:11.7rem; background:url('../img/obj-emerald-map-postmark.png') no-repeat center; background-size:100% auto; }
#emerald > .map .con .item { position:absolute; z-index:2; }
#emerald > .map .con .item::before, 
#emerald > .map .con .item::after { content:''; position:absolute; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
#emerald > .map .con .item > a { display:flex; justify-content:center; align-items:center; position:relative; width:100%; height:100%; padding:0 .2rem .3rem 0; background-repeat:no-repeat; background-position:center; background-size:100% auto; color:#fff; font-family:'HakgyoansimSiganpyoR'; font-size:1.3rem; line-height:1.5rem; letter-spacing:-.325px; text-align:center; }
#emerald > .map .con .item > a::before { content:''; position:absolute; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
#emerald > .map .con .item > a::after { content:'>'; margin-left:.8rem; color:#fff; font-family:'TTHakgyoansimMabeopsaR'; font-size:1.5rem; letter-spacing:-0.375px; }
#emerald > .map .con .item1 { top:9.7rem; right:calc(50% - 18rem + 6.9rem); width:11.4rem; height:4.9rem; }
#emerald > .map .con .item2 { top:7.5rem; left:calc(50% - 18rem + 5.6rem); width:11.7rem; height:5.3rem; }
#emerald > .map .con .item3 { top:29.2rem; right:calc(50% - 18rem + 3.7rem); width:13.9rem; height:3.5rem; }
#emerald > .map .con .item4 { top:24rem; right:calc(50% - 18rem + 4.4rem); width:10.4rem; height:3.5rem; }
#emerald > .map .con .item5 { top:15.4rem; left:calc(50% - 18rem + 11.9rem); width:13.3rem; height:5.3rem; }
#emerald > .map .con .item6 { top:36.6rem; left:calc(50% - 18rem + 12rem); width:12.5rem; height:5.3rem; }
#emerald > .map .con .item7 { top:23.8rem; left:calc(50% - 18rem + 6.5rem); width:11.6rem; height:5.3rem; }
#emerald > .map .con .item8 { top:29.5rem; left:calc(50% - 18rem + 4.2rem); width:10.8rem; height:5.3rem; }
#emerald > .map .con .item9 { top:41.9rem; right:calc(50% - 18rem + 4.5rem); width:9.2rem; height:4.9rem; }
#emerald > .map .con .item10 { top:42.4rem; left:calc(50% - 18rem + 4.7rem); width:15rem; height:3.9rem; }
#emerald > .map .con .item1 > a { background-image:url('../img/bg-emerald-map-item1.png'); color:#4b3300; }
#emerald > .map .con .item2 > a { background-image:url('../img/bg-emerald-map-item2.png'); }
#emerald > .map .con .item3 > a { background-image:url('../img/bg-emerald-map-item3.png'); }
#emerald > .map .con .item4 > a { background-image:url('../img/bg-emerald-map-item4.png'); }
#emerald > .map .con .item5 > a { background-image:url('../img/bg-emerald-map-item5.png'); }
#emerald > .map .con .item6 > a { background-image:url('../img/bg-emerald-map-item6.png'); }
#emerald > .map .con .item7 > a { background-image:url('../img/bg-emerald-map-item7.png'); }
#emerald > .map .con .item8 > a { background-image:url('../img/bg-emerald-map-item8.png'); }
#emerald > .map .con .item9 > a { background-image:url('../img/bg-emerald-map-item9.png'); }
#emerald > .map .con .item10 > a { background-image:url('../img/bg-emerald-map-item10.png'); }
#emerald > .map .con .item1 > a::after { color:#4b3300; }
#emerald > .map .con .item1::after { right:-.9rem; bottom:-.9rem; width:4rem; height:3.4rem; background-image:url('../img/obj-emerald-map-item1-postmark.png'); }
#emerald > .map .con .item4::before { top:-3.8rem; right:1.5rem; width:5.3rem; height:4.7rem; background-image:url('../img/obj-emerald-map-item4-santa.png'); }
#emerald > .map .con .item4::after { top:-1.2rem; right:-.2rem; width:2.9rem; height:2.3rem; background-image:url('../img/obj-emerald-map-item4-camera.png'); }
#emerald > .map .con .item4 a::before { top:-.1rem; right:2.1rem; width:4.6rem; height:.9rem; background-image:url('../img/obj-emerald-map-item4-hand.png'); }
#emerald > .map .con .item5::before { top:-3.4rem; left:.8rem; width:5rem; height:4.6rem; background-image:url('../img/obj-emerald-map-item5-firecracker.png'); }
#emerald > .map .con .item5::after { bottom:.3rem; left:-1.1rem; width:3.1rem; height:3.1rem; background-image:url('../img/obj-emerald-map-item5-mic.png'); }
#emerald > .map .con .item6::after { top:-1.9rem; left:3.2rem; width:5.3rem; height:3.2rem; background-image:url('../img/obj-emerald-map-item6-glasses.png'); }
#emerald > .map .con .item7::after { top:-1.9rem; left:-.2rem; width:2.7rem; height:4rem; background-image:url('../img/obj-emerald-map-item7-tree.png'); }

#emerald > .map .popup .swiper { overflow:initial; width:100%; max-width:36rem; }
#emerald > .map .popup .img { position:relative; width:26rem; margin:0 auto; aspect-ratio:260 / 160; }
#emerald > .map .popup .txt { margin-top:1.7rem; }
#emerald > .map .popup .txt h5 { font-family:'HakgyoansimSiganpyoR'; font-size:2.7rem; font-weight:normal; line-height:3rem; letter-spacing:-1.35px; }
#emerald > .map .popup .txt p { margin-top:1.7rem; font-size:1.4rem; line-height:2.1rem; letter-spacing:-.7px; }
#emerald > .map .popup .txt hr { width:20rem; margin:1.5rem auto; border-style:dashed; }
#emerald > .map .popup .txt .list-info li::before { top:.2rem; }
#emerald > .map .popup .txt .list-caution { margin-top:.8rem; }
#emerald > .map .popup .txt .list-caution li { padding-left:0; color:#999999; }
#emerald > .map .popup .txt .list-caution li::before { position:relative; top:auto; left:auto; margin-right:.2rem; }
#emerald > .map .popup .control { display:flex; justify-content:space-between; align-items:center; margin:0 2rem; }
#emerald > .map .popup .control .swiper-button-prev, 
#emerald > .map .popup .control .swiper-button-next { position:relative; top:auto; right:auto; left:auto; width:2rem; height:1.2rem; }
#emerald > .map .popup .control .swiper-button-prev { background-image:url('../img/ico-emerald-map-popup-prev.png'); } 
#emerald > .map .popup .control .swiper-button-next { background-image:url('../img/ico-emerald-map-popup-next.png'); }
#emerald > .map .popup .item1 .content { background-image:url('../img/bg-emerald-map-popup-item1.png'); aspect-ratio:360 / 514; }
#emerald > .map .popup .item2 .content { background-image:url('../img/bg-emerald-map-popup-item2.png'); aspect-ratio:360 / 489; }
#emerald > .map .popup .item3 .content { background-image:url('../img/bg-emerald-map-popup-item3.png'); aspect-ratio:360 / 489; }
#emerald > .map .popup .item4 .content { background-image:url('../img/bg-emerald-map-popup-item4.png'); aspect-ratio:360 / 463; }
#emerald > .map .popup .item5 .content { background-image:url('../img/bg-emerald-map-popup-item5.png'); aspect-ratio:360 / 527; }
#emerald > .map .popup .item6 .content { background-image:url('../img/bg-emerald-map-popup-item6.png'); aspect-ratio:360 / 576; }
#emerald > .map .popup .item7 .content { background-image:url('../img/bg-emerald-map-popup-item7.png'); aspect-ratio:360 / 626; }
#emerald > .map .popup .item8 .content { background-image:url('../img/bg-emerald-map-popup-item8.png'); aspect-ratio:360 / 514; }
#emerald > .map .popup .item9 .content { background-image:url('../img/bg-emerald-map-popup-item9.png'); aspect-ratio:360 / 526; }
#emerald > .map .popup .item10 .content { background-image:url('../img/bg-emerald-map-popup-item10.png'); aspect-ratio:360 / 514; }
#emerald > .map .popup .item1 .txt { color:#6d4300; }
#emerald > .map .popup .item1 .txt h5 { color:#ba7b00 ; }
#emerald > .map .popup .item1 .txt hr { border-color:#8c6b37; }
#emerald > .map .popup .item1 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item1-place.png'); }
#emerald > .map .popup .item1 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item1-date.png'); }
#emerald > .map .popup .item1 .obj.top { top:.2rem; right:0; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .map .popup .item1 .obj.cane { top:22.5rem; right:calc(50% - 18rem + 4.4rem); width:5.1rem; height:4.9rem; margin:0 auto; }
#emerald > .map .popup .item2 .txt { color:#790000; }
#emerald > .map .popup .item2 .txt h5 { color:#a20000; }
#emerald > .map .popup .item2 .txt hr { border-color:#ca4e4c; }
#emerald > .map .popup .item2 .txt .list-info li { color:#930000; }
#emerald > .map .popup .item2 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item2-place.png'); }
#emerald > .map .popup .item2 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item2-date.png'); }
#emerald > .map .popup .item2 .obj.top { top:-.2rem; left:calc(50% - 18rem); width:14rem; height:9.1rem; }
#emerald > .map .popup .item2 .obj.bottom { right:calc(50% - 18rem + .6rem); bottom:2.1rem; width:6.6rem; height:6.6rem; }
#emerald > .map .popup .item2 .obj.home { top:17.2rem; left:calc(50% - 18rem + 4.2rem); width:5rem; height:5.4rem; }
#emerald > .map .popup .item2 .obj.tree { top:31.1rem; right:calc(50% - 18rem + 5.5rem); width:2.6rem; height:4.7rem; }
#emerald > .map .popup .item3 .txt { color:#c1192d; }
#emerald > .map .popup .item3 .txt h5 { color:#b20000; }
#emerald > .map .popup .item3 .txt hr { border-color:#ce4b5a; }
#emerald > .map .popup .item3 .txt .list-info li { color:#b20000; }
#emerald > .map .popup .item3 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item3-place.png'); }
#emerald > .map .popup .item3 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item3-date.png'); }
#emerald > .map .popup .item3 .obj.light { top:1.6rem; right:calc(50% - 18rem + 1.9rem); width:14.6rem; height:8.8rem; }
#emerald > .map .popup .item3 .obj.gift { top:17.3rem; left:calc(50% - 18rem + 3rem); width:5.3rem; height:5.9rem; }
#emerald > .map .popup .item4 .txt { color:#bd1d1b; }
#emerald > .map .popup .item4 .txt h5 { color:#c70000; }
#emerald > .map .popup .item4 .txt hr { border-color:#b1505b; }
#emerald > .map .popup .item4 .txt .list-info li { color:#ad0000; }
#emerald > .map .popup .item4 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item4-place.png'); }
#emerald > .map .popup .item4 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item4-date.png'); }
#emerald > .map .popup .item4 .obj.camera { top:18.9rem; right:calc(50% - 18rem + 2.4rem); width:9rem; height:6.6rem; }
#emerald > .map .popup .item4 .obj.leaf { top:33.3rem; left:calc(50% - 18rem + 5rem); width:3.2rem; height:2.8rem; }
#emerald > .map .popup .item5 .txt { color:#6a0e9f; }
#emerald > .map .popup .item5 .txt h5 { color:#9325d3; }
#emerald > .map .popup .item5 .txt hr { border-color:#8e48b4; }
#emerald > .map .popup .item5 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item5-place.png'); }
#emerald > .map .popup .item5 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item5-date.png'); }
#emerald > .map .popup .item5 .obj.firecracker { top:-1.3rem; right:0; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .map .popup .item5 .obj.mic { top:26.5rem; left:calc(50% - 18rem + 6rem); width:3rem; height:4.6rem; }
#emerald > .map .popup .item6 .txt { color:#005e35; }
#emerald > .map .popup .item6 .txt h5 { color:#009300; }
#emerald > .map .popup .item6 .txt hr { border-color:#48b647; }
#emerald > .map .popup .item6 .txt .list-info li { color:#005800; }
#emerald > .map .popup .item6 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item6-place.png'); }
#emerald > .map .popup .item6 .txt .list-info li.time::before { background-image:url('../img/obj-emerald-map-popup-item6-time.png'); }
#emerald > .map .popup .item6 .obj.top { top:.6rem; right:0; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .map .popup .item6 .obj.lara { top:14.3rem; right:calc(50% - 18rem + 3.1rem); width:10.2rem; height:11.3rem; }
#emerald > .map .popup .item6 .obj.glasses { top:33.3rem; left:calc(50% - 18rem + 3.7rem); width:8.6rem; height:6.3rem; }
#emerald > .map .popup .item7 .txt { color:#035103; }
#emerald > .map .popup .item7 .txt h5 { color:#006f00; }
#emerald > .map .popup .item7 .txt hr { border-color:#3a773a; }
#emerald > .map .popup .item7 .txt .list-info li { color:#002900; }
#emerald > .map .popup .item7 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item7-place.png'); }
#emerald > .map .popup .item7 .txt .list-info li.date::before { background-image:url('../img/obj-emerald-map-popup-item7-date.png'); }
#emerald > .map .popup .item7 .txt .btn-wrap { margin-top:.8rem; }
#emerald > .map .popup .item7 .txt .btn-wrap .btn { display:flex; justify-content:space-between; align-items:center; width:16.3rem; height:4.6rem; padding:0 2.5rem; margin:0 auto; background:url('../img/btn-emerald-map-popup-item7.png') no-repeat center; background-size:100% auto; color:#e2ffe2; font-size:1.4rem; font-weight:500; line-height:1; letter-spacing:-.7px; }
#emerald > .map .popup .item7 .txt .btn-wrap .btn::after { content:'>'; margin-top:.1rem; font-family:'TTHakgyoansimMabeopsaR'; font-size:1.7rem; line-height:1; letter-spacing:-.85px; }
#emerald > .map .popup .item7 .obj.light1 { top:1.8rem; right:calc(50% - 18rem + 2.3rem); width:15.1rem; height:7.5rem; }
#emerald > .map .popup .item7 .obj.snowman { top:15rem; left:calc(50% - 18rem + 4.4rem); width:6rem; height:8.7rem; }
#emerald > .map .popup .item7 .obj.donna { top:15.2rem; right:calc(50% - 18rem + 3.8rem); width:10.9rem; height:8.8rem; }
#emerald > .map .popup .item7 .obj.star { top:42.3rem; left:calc(50% - 18rem + 4.5rem); width:4.9rem; height:5.2rem; }
#emerald > .map .popup .item7 .obj.light2 { right:calc(50% - 18rem + 2.1rem); bottom:1.4rem; width:10.3rem; height:3.9rem; }
#emerald > .map .popup .item8 .txt { color:#005e35 ; }
#emerald > .map .popup .item8 .txt h5 { color:#00931c; }
#emerald > .map .popup .item8 .txt hr { border-color:#388060; }
#emerald > .map .popup .item8 .txt .list-info li { color:#003a07; }
#emerald > .map .popup .item8 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item8-place.png'); }
#emerald > .map .popup .item8 .txt .list-info li.time::before { background-image:url('../img/obj-emerald-map-popup-item8-time.png'); }
#emerald > .map .popup .item8 .obj.balloon { top:-1.4rem; left:calc(50% - 18rem + 9.2rem); width:5rem; height:9.4rem; }
#emerald > .map .popup .item8 .obj.arrow { top:33rem; right:calc(50% - 18rem + 5rem); width:5.9rem; height:4.8rem; }
#emerald > .map .popup .item9 .txt { color:#9a5503 ; }
#emerald > .map .popup .item9 .txt h5 { color:#b45500; }
#emerald > .map .popup .item9 .txt hr { border-color:#b55700; }
#emerald > .map .popup .item9 .txt .list-info li { color:#812d00; }
#emerald > .map .popup .item9 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item9-place.png'); }
#emerald > .map .popup .item9 .txt .list-info li.time::before { background-image:url('../img/obj-emerald-map-popup-item9-time.png'); }
#emerald > .map .popup .item9 .obj.light { top:1.8rem; right:calc(50% - 18rem + 2rem); width:14.4rem; height:6.4rem; }
#emerald > .map .popup .item9 .obj.jack { top:13.8rem; left:calc(50% - 18rem + 2.5rem); width:10.2rem; height:9.2rem; }
#emerald > .map .popup .item9 .obj.brick { top:31.2rem; right:calc(50% - 18rem + 4.6rem); width:7.6rem; height:6.1rem; }
#emerald > .map .popup .item10 .img::before { content:''; position:absolute; top:-2.8rem; right:calc(50% - 18rem + 9.7rem); width:6rem; height:2.8rem; background:url('../img/obj-emerald-map-popup-item10-cookie1.png') no-repeat center bottom; background-size:100% auto; }
#emerald > .map .popup .item10 .txt { color:#7d5f16 ; }
#emerald > .map .popup .item10 .txt h5 { color:#8c6700 ; }
#emerald > .map .popup .item10 .txt hr { border-color:#998148 ; }
#emerald > .map .popup .item10 .txt .list-info li { color:#5d3900; }
#emerald > .map .popup .item10 .txt .list-info li.place::before { background-image:url('../img/obj-emerald-map-popup-item10-place.png'); }
#emerald > .map .popup .item10 .obj.lara { top:13.7rem; left:calc(50% - 18rem + 2.2rem); width:6.2rem; height:10.4rem; }
#emerald > .map .popup .item10 .obj.bagel { top:23.1rem; right:calc(50% - 18rem + 3.5rem); width:8.4rem; height:13.9rem; }
#emerald > .map .popup .item10 .obj.cookie { top:36.7rem; left:calc(50% - 18rem + 6rem); width:2.4rem; height:2.4rem; }

#emerald > .photo { padding:7.7rem 0 6.2rem; background:url('../img/bg-emerald-photo.png') no-repeat center top; background-size:100% auto; }
#emerald > .photo::before { content:''; position:absolute; top:-.6rem; left:calc(50% - 18rem - 1.2rem); width:9.6rem; height:13.7rem; background:url('../img/obj-emerald-photo-jack.png') no-repeat center; background-size:100% auto; }
#emerald > .photo::after { content:''; position:absolute; right:calc(50% - 18rem + 7.5rem); bottom:1.2rem; width:2.1rem; height:2.2rem; background:url('../img/obj-emerald-photo-snow2.png') no-repeat center; background-size:100% auto; }
#emerald > .photo h4::before { content:''; position:absolute; top:3.3rem; left:calc(50% - 18rem + 7.9rem); width:3.2rem; height:3.1rem; background:url('../img/obj-emerald-photo-snow1.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .con { position:relative; margin-top:1.9rem; }
#emerald > .photo .con::before { content:''; position:absolute; top:-3.9rem; right:calc(50% - 18rem + 1.4rem); width:4.4rem; height:4.8rem; background:url('../img/obj-emerald-photo-toto.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .swiper { overflow:initial; width:100%; max-width:36rem; aspect-ratio:360 / 528; }
#emerald > .photo .swiper .slide-wrap { position:absolute; top:0; right:0; left:0; width:100%; height:100%; margin:0 auto; background:url('../img/bg-emerald-photo-slide.png') no-repeat center top; background-size:100% auto; }
#emerald > .photo .swiper .swiper-slide::after { content:''; position:absolute; top:0; right:0; left:0; width:100%; height:100%; margin:0 auto; background:url('../img/obj-emerald-photo-frame.png') no-repeat center top; background-size:100% auto; }
#emerald > .photo .swiper .swiper-button-prev,
#emerald > .photo .swiper .swiper-button-next { top:27.5rem; width:1.7rem; height:2.5rem; }
#emerald > .photo .swiper .swiper-button-prev { left:calc(50% - 18rem + 4.8rem); background-image:url('../img/ico-emerald-photo-prev.png'); }
#emerald > .photo .swiper .swiper-button-next { right:calc(50% - 18rem + 4.8rem); background-image:url('../img/ico-emerald-photo-next.png'); }
#emerald > .photo .slide-wrap .img { width:calc(100% - 6rem); max-width:30rem; margin:2.3rem auto 0; aspect-ratio:300 / 155; }
#emerald > .photo .slide-wrap .txt { position:relative; margin-top:1.7rem; }
#emerald > .photo .slide-wrap .txt h5 { position:relative; color:#277145; font-family:'HakgyoansimSiganpyoR'; font-size:2.7rem; font-weight:normal; line-height:3.2rem; letter-spacing:-.675px; }
#emerald > .photo .slide-wrap .txt p { margin-top:2.6rem; color:#193b27; }
#emerald > .photo .slide-wrap .txt hr { width:16.7rem; margin:1.5rem auto 1.4rem; border-style:dashed; border-color:#277145; }
#emerald > .photo .slide-wrap .txt .list-info li { color:#277145; line-height:1.4rem; letter-spacing:-.7px; }
#emerald > .photo .slide-wrap .txt .list-info li + li { margin-top:.7rem; }
#emerald > .photo .slide-wrap .txt .list-info li.place::before { background-image:url('../img/ico-emerald-photo-place.png'); }
#emerald > .photo .slide-wrap .txt .list-info li.time::before { background-image:url('../img/ico-emerald-photo-time.png'); }
#emerald > .photo .slide-wrap .txt .list-info li em { color:#44a263; }
#emerald > .photo .slide-wrap .txt .list-caution { margin-top:.6rem; }
#emerald > .photo .slide-wrap .txt .list-caution li { padding-left:0; color:#44a263; font-size:1.4rem; line-height:1.9rem; letter-spacing:-.7px; }
#emerald > .photo .slide-wrap .txt .list-caution li::before { position:relative; top:auto; left:auto; margin-right:.2rem; }
#emerald > .photo .item1 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide1.png'); }
#emerald > .photo .item3 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide3.png'); }
#emerald > .photo .item4 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide4.png'); }
#emerald > .photo .item5 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide5.png'); }
#emerald > .photo .item6 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide6.png'); }
#emerald > .photo .item7 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide7.png'); }
#emerald > .photo .item8 .slide-wrap { background-image:url('../img/bg-emerald-photo-slide8.png'); }
#emerald > .photo .item2 .slide-wrap .txt::after { content:''; position:absolute; top:-5.2rem; right:calc(50% - 18rem + 2.5rem); width:7.3rem; height:11.3rem; background:url('../img/obj-emerald-photo-item2-snowman.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .item2 .slide-wrap .txt h5::before { content:''; position:absolute; top:2.8rem; left:calc(50% - 16rem + 4.8rem); width:3.8rem; height:3.8rem; background:url('../img/obj-emerald-photo-item2-leaf.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .item5 .slide-wrap .txt h5::after { content:''; position:absolute; top:-.4rem; right:calc(50% - 16rem + 2.6rem); width:4.2rem; height:2.1rem; background:url('../img/obj-emerald-photo-item5-charge.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .item8 .slide-wrap .txt::before { content:''; position:absolute; top:-1.7rem; left:calc(50% - 18rem + 2rem); width:8.5rem; height:4.1rem; background:url('../img/obj-emerald-photo-item8-deco.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .item8 .slide-wrap .txt::after { content:''; position:absolute; top:-2.3rem; right:calc(50% - 18rem + 4.5rem); width:4.5rem; height:5.7rem; background:url('../img/obj-emerald-photo-item8-deco2.png') no-repeat center; background-size:100% auto; }
#emerald > .photo .item1 .obj { right:0; bottom:2.5rem; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .photo .item2 .obj { right:0; bottom:2.9rem; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .photo .item3 .obj.top { top:16.1rem; left:calc(50% - 18rem + 1.7rem); width:8.6rem; }
#emerald > .photo .item3 .obj.bottom { right:0; bottom:.8rem; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .photo .item4 .obj { right:0; bottom:2rem; left:0; width:100%; max-width:36rem; margin:0 auto; }
#emerald > .photo .item5 .obj { right:calc(50% - 18rem + 3rem); bottom:2.2rem; width:5.8rem; height:9.9rem; }
#emerald > .photo .item6 .obj.hat { right:calc(50% - 18rem); bottom:3.1rem; width:13.4rem; height:8.4rem; }
#emerald > .photo .item6 .obj.gift { left:calc(50% - 18rem + 2.5rem); bottom:.9rem; width:9rem; height:9.3rem; }
#emerald > .photo .item7 .obj.butterfly1 { top:16rem; right:calc(50% - 18rem + 5.5rem); width:6.7rem; height:4.9rem; }
#emerald > .photo .item7 .obj.butterfly2 { bottom:17.3rem; right:calc(50% - 18rem + 7.1rem); width:2.7rem; height:2.9rem; }
#emerald > .photo .item7 .obj.butterfly3 { top:16.4rem; left:calc(50% - 18rem + 4.5rem); width:5.5rem; height:5.3rem; }
#emerald > .photo .item7 .obj.butterfly4 { top:4.1rem; left:calc(50% - 18rem + 3.9rem); width:5.9rem; height:6.7rem; }
#emerald > .photo .item7 .obj.butterfly5 { top:5.6rem; right:calc(50% - 18rem + 4.3rem); width:5.5rem; height:5.3rem; }
#emerald > .photo .item8 .obj.bear { right:calc(50% - 18rem + 2.1rem); bottom:3rem; width:6.8rem; height:13.1rem; }
#emerald > .photo .item8 .obj.deco { bottom:11.2rem; left:calc(50% - 18rem + 4.9rem); width:2.7rem; height:2.6rem; }


/* food */
#food { padding-top:28.33vw; background:url('../img/bg-food.jpg') no-repeat center top; background-size:100% auto; }
#food .sec { position:relative; }
#food .sec::before,
#food .sec::after { content:''; position:absolute; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
#food .con { width:100%; max-width:36rem; margin:0 auto; }
#food .con ul { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; }
#food .txt h5 { font-family:'HakgyoansimSiganpyoR'; font-size:1.9rem; font-weight:normal; line-height:1.9rem; letter-spacing:-.95px; }
#food .txt p { display:flex; justify-content:center; align-items:center; margin-top:.2rem; font-size:1.3rem; line-height:1.8rem; letter-spacing:-.65px; }
#food .txt p::before { content:''; width:1.1rem; height:1.1rem; margin-right:.2rem; background-repeat:no-repeat; background-position:center; background-size:100% auto; }

#food .eat { padding:2.7rem 0 .2rem 0; }
#food .eat::before { top:-1rem; left:calc(50% - 18rem - 3.6rem); width:13.5rem; height:8.9rem; background-image:url('../img/obj-food-donna.png'); }
#food .eat > p { width:100%; max-width:36rem; margin:1.3rem auto 0; }
#food .eat .con { position:relative; margin-top:1.5rem; }
#food .eat .con::before { content:''; position:absolute; top:-6.7rem; right:calc(50% - 18rem + 1.8rem); width:6.4rem; height:7.3rem; background:url('../img/obj-food-eat-drink.png') no-repeat center; background-size:100% auto; }
#food .eat .con ul { column-gap:1.1rem; row-gap:1.9rem; }
#food .eat .con li { display:flex; flex-direction:column; justify-content:flex-start; align-items:center; width:15.5rem; height:18.2rem; padding-top:.6rem; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
#food .eat .con li .img { width:12.8rem; margin:0 auto; }
#food .eat .con .item1 { background-image:url('../img/bg-food-eat-item1.png'); }
#food .eat .con .item1 .txt h5 { color:#fbebd9; }
#food .eat .con .item1 .txt p { color:#c29581; }
#food .eat .con .item1 .txt p::before { background-image:url('../img/obj-food-eat-item1-place.png'); }
#food .eat .con .item2 { background-image:url('../img/bg-food-eat-item2.png'); }
#food .eat .con .item2 .txt h5 { color:#f7d7d5; }
#food .eat .con .item2 .txt p { color:#d07775 ; }
#food .eat .con .item2 .txt p::before { background-image:url('../img/obj-food-eat-item2-place.png'); }
#food .eat .con .item3 { background-image:url('../img/bg-food-eat-item3.png'); }
#food .eat .con .item3 .txt h5 { color:#fbd7ae; }
#food .eat .con .item3 .txt p { color:#cea058  ; }
#food .eat .con .item3 .txt p::before { background-image:url('../img/obj-food-eat-item3-place.png'); }
#food .eat .con .item4 { background-image:url('../img/bg-food-eat-item4.png'); }
#food .eat .con .item4 .txt h5 { color:#f0bdb3; }
#food .eat .con .item4 .txt p { color:#c3a49e  ; }
#food .eat .con .item4 .txt p::before { background-image:url('../img/obj-food-eat-item4-place.png'); }
#food .eat .con .item5 { background-image:url('../img/bg-food-eat-item5.png'); }
#food .eat .con .item5 .txt h5 { color:#985b08; }
#food .eat .con .item5 .txt p { color:#a97f42  ; }
#food .eat .con .item5 .txt p::before { background-image:url('../img/obj-food-eat-item5-place.png'); }
#food .eat .con .item6 { background-image:url('../img/bg-food-eat-item6.png'); }
#food .eat .con .item6 .txt h5 { color:#875600 ; }
#food .eat .con .item6 .txt p { color:#a76c03  ; }
#food .eat .con .item6 .txt p::before { background-image:url('../img/obj-food-eat-item6-place.png'); }
#food .eat .con .item7 { background-image:url('../img/bg-food-eat-item7.png'); }
#food .eat .con .item7 .txt h5 { color:#fcd5c6; }
#food .eat .con .item7 .txt p { color:#c7917f  ; }
#food .eat .con .item7 .txt p::before { background-image:url('../img/obj-food-eat-item7-place.png'); }
#food .eat .con .item8 { background-image:url('../img/bg-food-eat-item8.png'); }
#food .eat .con .item8 .txt h5 { color:#b68e00; }
#food .eat .con .item8 .txt p { color:#bf9500  ; }
#food .eat .con .item8 .txt p::before { background-image:url('../img/obj-food-eat-item8-place.png'); }

#food .rec { padding:9.4rem 0; margin-top:-.6rem; background:url('../img/bg-food-rec.png') no-repeat center top; background-size:100% auto; }
#food .rec::before { top:.5rem; left:calc(50% - 18rem - 6.3rem); width:21.1rem; height:8.1rem; background-image:url('../img/obj-food-ribbon.png'); }
#food .rec::after { right:0; bottom:0; left:0; margin:0 auto; background-image:url('../img/obj-food-rec-bg.png'); aspect-ratio:360 / 146; }
#food .rec .con { position:relative; z-index:2; margin-top:1.5rem; }
#food .rec .con::before { content:''; position:absolute; bottom:-2rem; left:calc(50% - 18rem - .6rem); z-index:2; width:6.8rem; height:9.6rem; background:url('../img/obj-food-rec-lenny.png') no-repeat center; background-size:100% auto; }
#food .rec .con::after { content:''; position:absolute; top:-8.9rem; right:calc(50% - 18rem + 2.1rem); z-index:2; width:5.1rem; height:4.6rem; background:url('../img/obj-food-rec-toto.png') no-repeat center; background-size:100% auto; }
#food .rec .con ul { column-gap:1rem; row-gap:.8rem; }
#food .rec .con li { width:15.3rem; }
#food .rec .con li .txt { display:flex; flex-direction:column; justify-content:center; align-items:center; background-repeat:no-repeat; background-position:center; background-size:100% auto; aspect-ratio:153 / 72; }
#food .rec .con li .txt h5 { display:flex; justify-content:center; align-items:center; height:3.8rem; color:#fcfbf9; }
#food .rec .con li .txt p { color:#faf8f6; }
#food .rec .con li .txt p::before { background-image:url('../img/obj-food-rec-item-place.png'); }
#food .rec .con .item1 .txt { background-image:url('../img/bg-food-rec-item1.png'); }
#food .rec .con .item2 .txt { background-image:url('../img/bg-food-rec-item2.png'); }

#food .street { padding:8.9rem 0 3.5rem; margin-top:-8rem; background:url('../img/bg-food-street.png') no-repeat center top; background-size:100% auto; }
#food .street::before { top:9.5rem; right:calc(50% - 18rem + 1rem); width:7.1rem; height:7.5rem; background-image:url('../img/obj-food-street-deco1.png'); }
#food .street::after { bottom:0rem; left:calc(50% - 18rem + 1rem); width:7.5rem; height:9.1rem; background-image:url('../img/obj-food-street-deco2.png'); }
#food .street .img { width:100%; max-width:36rem; margin:1.1rem auto 0; }
#food .street .list-caution { margin-top:1.7rem; }
#food .street .list-caution li { padding-left:0; color:#f6b7b4; }
#food .street .list-caution li::before { position:relative; top:auto; left:auto; margin-right:.2rem; }


/* gift */
#gift { padding-top:31.11vw; background:url('../img/bg-gift.jpg') no-repeat center top; background-size:100% auto; }

#gift .buy { padding-bottom:13.3rem; margin-top:1rem; } 
#gift .buy .con { width:100%; max-width:36rem; margin:2rem auto 0; }
#gift .buy .con li { display:flex; justify-content:center; align-items:center; position:relative; }
#gift .buy .con li:nth-child(even) { flex-direction:row-reverse; }
#gift .buy .con li > * { width:16rem; height:14rem; }
#gift .buy .con li .txt { display:flex; flex-direction:column; justify-content:center; align-items:center; background:url('../img/bg-gift-buy-item.jpg') no-repeat center; background-size:100% auto; }
#gift .buy .con li .txt h5 { color:#ffda0c; font-family:'HakgyoansimSiganpyoR'; font-size:1.8rem; font-weight:normal; line-height:1.9rem; letter-spacing:-.9px; text-shadow:0 .1rem .5rem rgba(0, 0, 0, .25); }
#gift .buy .con li .txt p { margin-top:.8rem; color:#f4e1d2; font-size:1.2rem; font-weight:400; line-height:1.6rem; letter-spacing:-.6px; }
#gift .buy .con li.item1::before { content:''; position:absolute; top:-2.6rem; left:calc(50% - 18rem - .6rem); width:6.6rem; height:6.9rem; background:url('../img/obj-gift-buy-ribbon1.png') no-repeat center; background-size:100% auto; }
#gift .buy .con li.item4::after { content:''; position:absolute; top:-2.6rem; right:calc(50% - 18rem - 1.2rem); width:7.1rem; height:6.7rem; background:url('../img/obj-gift-buy-ribbon2.png') no-repeat center; background-size:100% auto; }
#gift .buy .con li.item5 > .img { position:relative; width:32rem; height:auto; }
#gift .buy .con li.item5 > .img::before { content:''; position:absolute; top:1.1rem; right:0; left:0; width:5.4rem; height:4.8rem; margin:0 auto; background:url('../img/obj-gift-buy-item5-ribbon.png') no-repeat center; background-size:100% auto; }
#gift .buy .con li.item5 > .img::after { content:''; position:absolute; right:0; bottom:-1.8rem; left:0; width:32rem; margin:0 auto; background:url('../img/obj-gift-buy-item5-bottom.png') no-repeat center; background-size:100% auto; aspect-ratio:320 / 121; }

#gift .wish { padding:8.2rem 0 5.5rem; margin-top:-8.2rem; background:url('../img/bg-gift-wish.png') no-repeat center top; background-size:100% auto; }
#gift .wish .list-info { margin-top:1.3rem; }
#gift .wish .list-info li { font-family:'HakgyoansimSiganpyoR'; font-size:1.8rem; line-height:1.8rem; letter-spacing:-.9px; }
#gift .wish .list-info li small { font-size:1.5rem; }
#gift .wish .list-caution { margin-top:.3rem; }
#gift .wish .list-caution li { color:#25a79e; }
#gift .wish .txt { color:#0b6b64; font-size:1.4rem; line-height:2.1rem; letter-spacing:-.7px; }
#gift .wish h4 + .list-info li { color:#25a79e; }
#gift .wish h4 + .list-info li.place::before { background-image:url('../img/obj-gift-wish-place.png'); }
#gift .wish .info .img { position:relative; margin:2rem auto 1rem; }
#gift .wish .info .img::before { content:''; position:absolute; top:-.9rem; right:calc(50% - 18rem + 6.2rem); width:2.9rem; height:4.6rem; background:url('../img/obj-gift-wish-deco1.png') no-repeat center; background-size:100% auto; }
#gift .wish .info .img::after { content:''; position:absolute; top:12.1rem; left:calc(50% - 18rem + 1.6rem); width:4.9rem; height:2.9rem; background:url('../img/obj-gift-wish-deco2.png') no-repeat center; background-size:100% auto; }
#gift .wish .info .img img { max-width:36rem; margin:0 auto; }
#gift .wish .info .img .obj.open { top:-2.5rem; left:calc(50% - 18rem - 8.8rem); width:17.6rem; height:10.2rem; }
#gift .wish .info .txt { color:#0b6b64; }
#gift .wish .info .btn-wrap { position:relative; margin-top:1.5rem; }
#gift .wish .info .btn-wrap::before { content:''; position:absolute; top:-.6rem; left:calc(50% - 9rem - .6rem); width:2.6rem; height:2.7rem; background:url('../img/obj-gift-wish-btn-deco1.png') no-repeat center; background-size:100% auto; }
#gift .wish .info .btn-wrap::after { content:''; position:absolute; bottom:-1.4rem; right:calc(50% - 9rem - 2.8rem); width:4.5rem; height:6.2rem; background:url('../img/obj-gift-wish-btn-deco2.png') no-repeat center; background-size:100% auto; }
#gift .wish .info .btn-wrap .btn { display:flex; justify-content:space-between; align-items:center; width:18.1rem; height:4.1rem; padding:0 2.9rem; margin:0 auto; border-radius:2.1rem; background-color:#178d85; color:#f1feff; font-family:'HakgyoansimSiganpyoR'; font-size:1.7rem; line-height:1; letter-spacing:-.85px; vertical-align:middle; box-shadow:0 .3rem .3rem rgba(0, 0, 0, .1); }
#gift .wish .info .btn-wrap .btn::after { content:'>'; }
#gift .wish .letter { position:relative; width:100%; max-width:36rem; margin:5.6rem auto 0; }
#gift .wish .letter .obj.txt1 { top:3.5rem; right:0; left:0; width:100%; max-width:36rem; margin:0 auto; opacity:0; transform:translateY(1rem); }
#gift .wish .letter .obj.txt2 { right:0; bottom:8.2rem; left:0; width:100%; max-width:36rem; margin:0 auto; opacity:0; }
@keyframes letter1 {
	0% { opacity:0; transform:translateY(1rem); }
	100% { opacity:1; transform:translateY(0); }
}
@keyframes letter2 {
	0% { opacity:0; }
	100% { opacity:1; }
}
#gift .wish .letter.on .obj.txt1 { animation: letter1 1s linear 0s 1 forwards; }
#gift .wish .letter.on .obj.txt2 { animation: letter2 1s linear 1s 1 forwards; }
#gift .wish .md { width:100%; max-width:36rem; margin:5rem auto 0; }
#gift .wish .md li + li { margin-top:.5rem; }
#gift .wish .lounge { margin-top:5.5rem; }
#gift .wish .lounge h5 + .list-info li { color:#1b7edb; }
#gift .wish .lounge h5 + .list-info li.place::before { background-image:url('../img/obj-gift-lounge-place.png'); }
#gift .wish .lounge .img { position:relative; margin:2.8rem auto 1.6rem; }
#gift .wish .lounge .img::before { content:''; position:absolute; bottom:-1.9rem; right:calc(50% - 18rem + .6rem); width:15.6rem; height:8.8rem; background:url('../img/obj-gift-lounge-deco.png') no-repeat center; background-size:100% auto; }
#gift .wish .lounge .img img { max-width:36rem; margin:0 auto; }
#gift .wish .lounge .img .obj.open { top:-3.2rem; left:calc(50% - 18rem - 8.9rem); width:18.1rem; height:10.5rem; }
#gift .wish .lounge .txt { color:#1b7edb; }

#gift .ticket { padding:4.8rem 0 5.5rem; background:url('../img/bg-gift-ticket.jpg') no-repeat center top; background-size:100% auto; }
#gift .ticket .con { margin-top:3.9rem; }
#gift .ticket .con .btn { display:flex; align-items:center; font-family:'HakgyoansimSiganpyoR'; }
#gift .ticket .con .btn::after { content:'>'; margin-left:1rem; font-size:1.3rem; }
#gift .ticket .list-wrap { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; column-gap:.6rem; row-gap:1.9rem; width:32.4rem; margin:0 auto; }
#gift .ticket .list-wrap > li { width:calc(50% - .3rem); }
#gift .ticket .list-wrap > li > a { display:block; }
#gift .ticket .list-wrap > li .txt { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:0 4.7rem 0 .2rem; background-repeat:no-repeat; background-position:top center; background-size:100% auto; font-family:'HakgyoansimSiganpyoR'; aspect-ratio:159 / 77; }
#gift .ticket .list-wrap > li .txt h5 { color:#fff; font-size:2rem; font-weight:normal; line-height:1; letter-spacing:-1px; }
#gift .ticket .list-wrap > li .txt p { margin-top:1px; color:#ffccc9; font-size:1.8rem; line-height:1; letter-spacing:-.9px; }
#gift .ticket .list-wrap > li .btn { justify-content:center; font-size:1.4rem; line-height:1.6rem; letter-spacing:-.7px; }
#gift .ticket .list-wrap > li:nth-child(1) .txt,
#gift .ticket .list-wrap > li:nth-child(4) .txt { background-image:url('../img/bg-gift-ticket-green.png'); }
#gift .ticket .list-wrap > li:nth-child(1) .txt p,
#gift .ticket .list-wrap > li:nth-child(4) .txt p { color:#88f0d3; }
#gift .ticket .list-wrap > li:nth-child(1) .btn,
#gift .ticket .list-wrap > li:nth-child(4) .btn { color:#0d4636; }
#gift .ticket .list-wrap > li:nth-child(2) .txt,
#gift .ticket .list-wrap > li:nth-child(3) .txt { background-image:url('../img/bg-gift-ticket-red.png'); }
#gift .ticket .list-wrap > li:nth-child(2) .txt p,
#gift .ticket .list-wrap > li:nth-child(3) .txt p { color:#ffccc9; }
#gift .ticket .list-wrap > li:nth-child(2) .btn,
#gift .ticket .list-wrap > li:nth-child(3) .btn { color:#e8382e; }
#gift .ticket .btn-wrap { margin-top:3.1rem; } 
#gift .ticket .btn-wrap .btn { position:relative; width:32.4rem; height:7rem; justify-content:flex-start; padding:0 0 .7rem 2.4rem; margin:0 auto; background:url('../img/btn-gift-ticket.png') no-repeat left top; background-size:auto 100%; color:#0d4636; font-size:1.6rem; line-height:1.9rem; letter-spacing:-.8px; }
#gift .ticket .btn-wrap .btn::before { content:''; position:absolute; bottom:-.4rem; right:calc(50% - 16.2rem + .1rem); width:7.9rem; height:10.1rem; background:url('../img/obj-gift-ticket-jack.png') no-repeat center; background-size:100% auto; }


@media (max-width:359px) {
	#emerald > .map .con .item1 { top:26.94vw; }
	#emerald > .map .con .item2 { top:20.83vw; }
	#emerald > .map .con .item3 { top:81.11vw; }
	#emerald > .map .con .item4 { top:66.67vw; }
	#emerald > .map .con .item5 { top:42.78vw; }
	#emerald > .map .con .item6 { top:101.67vw; }
	#emerald > .map .con .item7 { top:66.11vw; }
	#emerald > .map .con .item8 { top:81.94vw; }
	#emerald > .map .con .item9 { top:116.39vw; }
	#emerald > .map .con .item10 { top:117.78vw; }
	#emerald > .photo .swiper .swiper-button-prev, 
	#emerald > .photo .swiper .swiper-button-next { top:76.39vw; }
	#emerald > .photo .swiper .swiper-button-prev { left:4.8rem; }
	#emerald > .photo .swiper .swiper-button-next { right:4.8rem; }
	#emerald > .photo .slide-wrap .txt hr { margin:1rem auto 1.2rem; }
	#emerald > .photo .slide-wrap .txt p { margin-top:1rem; }
	#emerald > .photo .item5 .slide-wrap .txt h5::after { right:4.6rem; }
	#emerald > .photo .item2 .slide-wrap .txt::after { right:2.5rem; }
}


@media (min-width:501px) and (max-width:719px) {
	nav li[data-txt="emerald"] .sub-depth::before { left:2.2rem; }
	nav .menu .sub-depth ul[data-type="line"]::before { right:auto; margin:0; }
	nav .menu.emerald li[data-txt="emerald"]::before { right:-1.7rem; }
	nav .menu.emerald li[data-txt="emerald"]::after { right:.9rem; }
	nav .menu.food li[data-txt="food"]::before { right:-1.4rem; }
	nav .menu.gift li[data-txt="gift"]::before { right:-1.6rem; }

	#food .eat { padding-top:7.50vw; }
	#food .rec { padding:23.06vw 0 25.56vw; }
	#food .rec::before { left:-6.3rem; }
	#food .street { padding:23.61vw 0 13.06vw; margin-top:-23.61vw; }
}


@media (min-width:720px) { 
	html { height:100%; }
	body::-webkit-scrollbar { display:none; }
	body::before { content:''; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background:url('../img/bg.jpg') no-repeat center bottom; background-size:cover; z-index:-1; }
	

	/* layout */
	.wrapper { width:720px; height:100%; margin:0 auto; -ms-overflow-style:none; scrollbar-width:none; box-shadow:0px 4px 30px 0px rgba(0, 0, 0, 0.10); }
	.wrapper::-webkit-scrollbar { display:none; }
	.btn-menu,
	.btn-top { right:calc(50% - 360px + 1.8rem); }
	

	/* popup */
	.popup .content-wrap { max-width:none; }
	.popup .btn-close { margin-left:calc(576px - 3.4rem - 4rem); }


	nav .menu .obj-menu { height:500px; }
	nav .menu .obj-menu::before { height:946px; }
	nav .menu .depth { margin:0 60px; }
	nav .menu .depth > li > a::before { top:-14px; width:622px; height:28px; }
	nav li[data-txt="emerald"] .sub-depth::before { left:calc(50% - 300px + 2.2rem); }
	nav li[data-txt="emerald"] .sub-depth .city { padding-top:160px; }
	nav li[data-txt="emerald"] .sub-depth .photo { padding-top:86px; }
	nav li[data-txt="gift"] .sub-depth::after { width:152px; height:136px; }
	nav .menu .sub-depth { padding:38px 73px 49px; }
	nav .menu .sub-depth a[data-type="line"] { width:100%; }
	nav .menu.emerald li[data-txt="emerald"]::before { right:calc(50% - 300px - 1.7rem); }
	nav .menu.emerald li[data-txt="emerald"]::after { right:calc(50% - 300px + .9rem); }
	nav .menu.gift li[data-txt="gift"]::before { right:calc(50% - 300px - 1.6rem); }


	/* main */
	#main { height:928px; padding-top:260px; }
	#main .snow .ball { width:506px; height:506px; }
	#main .snow .ball .snowman { right:80px; bottom:138px; width:148px; }
	#main .snow .ball .firecracker1 { top:74px; left:72px; width:86px; }
	#main .snow .ball .firecracker2 { left:114px; width:130px; }
	#main .snow .ball .firecracker3 { top:18px; right:180px; width:136px; }
	#main .snow .ball .firecracker4 { top:60px; right:136px; width:70px; }
	#main .snow .bottom { width:720px; margin-top:-80px; }
	#main .snow .obj.donna { top:-28px; right:calc(50% - 360px + 68px); width:198px; }
	#main .snow .obj.bagel { top:-148px; right:calc(50% - 360px + 184px); width:206px; height:246px; }
	#main .snow .obj.jack { top:220px; left:calc(50% - 360px - 36px); width:136px; }
	#main .snow .obj.lenny { bottom:68px; left:calc(50% - 360px + 22px); width:200px; }
	#main .snow .obj.toto { bottom:-34px; left:calc(50% - 360px + 234px); width:334px; height:176px; }
	#main .snow .obj.toto .toto { left:calc(50% - 166px + 86px); width:100px; height:96px; }
	#main .snow .obj.lara { right:calc(50% - 360px + 36px); bottom:86px; width:170px; }
	#main .title { top:356px; max-width:720px; }
	#main .title::after { top:-46px; }
	#main .wreath { bottom:-174px; }
	#main .coach-mark { display:none; top:565px; width:72px; height:42px; }


	/* map */
	#map .obj.lenny { top:268px; left:calc(50% - 360px + 26px); width:130px; height:178px; }
	#map .obj.lara { top:calc(50% - 636px + 636px); right:calc(50% - 360px + 62px); width:112px; height:98px; }
	#map .obj.glasses { bottom:158px; left:calc(50% - 360px + 68px); width:140px; }
	#map .list .emerald { top:172px; right:calc(50% - 360px - 48px); width:526px; height:368px; }
	#map .list .food { top:calc(50% - 636px + 516px); left:calc(50% - 360px + 17px); width:392px; height:262px; }
	#map .list .food .snow-area { left:24px; width:338px; height:218px; }
	#christmasMenu { left:24px; }
	#map .list .gift { right:calc(50% - 360px + 28px); bottom:200px; width:478px; height:366px; }


	/* sub content */
	#emerald { padding-top:190px; }
	#emerald > .map::before { left:calc(50% - 360px + 4.3rem); }
	#emerald > .map::after { right:calc(50% - 360px + 1.3rem); }
	#emerald > .map .item > a::after { margin-left:16px; }
	#emerald > .photo::before { left:calc(50% - 360px - .5rem); }
	#emerald > .photo::after { right:calc(50% - 360px + 7.5rem); }
	#emerald > .photo h4::before { left:calc(50% - 360px + 7.8rem); }

	#food { padding-top:204px; }
	#food .eat { padding-top:54px; }
	#food .eat::before { left:calc(50% - 360px - 4.8rem); }
	#food .rec { padding:166px 0 184px; margin-top:-12px; }
	#food .rec::before { left:calc(50% - 360px - 6.3rem); }
	#food .rec::after { bottom:-34px; }
	#food .rec .con::before {  left:calc(50% - 360px + .6rem); }
	#food .rec .con::after { right:calc(50% - 360px + 2.1rem); }
	#food .street { padding:170px 0 94px; }
	#food .street::before { right:calc(50% - 360px + 1rem); }
	#food .street::after { left:calc(50% - 360px + 1rem); }

	#gift { padding-top:225px; }
	#gift .wish { padding:164px 0 110px; }
}

@media(max-width:359px) {
	html { font-size:calc(4px + 1.66667vw); }
}

@media(min-width:360px)and (max-width:500px) {
	html { font-size:calc(-4.4px + 4vw); }
}

@media(min-width:390px) {
	html { font-size:11px; }
}

@media(min-width:501px) {
	html { font-size:12px; }
}

@media(min-width:720px)and (hover:hover)and (pointer:fine) {
	html { font-size:16px; }
}