#skrollr-body{
	float:left;
	width:100%;
	height: 100%;
}

/*티켓예매버튼*/
.ticket_btn{
	width:80px;
	height: 120px;
	position: fixed;
	background:#fff;
	z-index: 1000;
	right:100px;
	top:150px;
	text-align: center;
	border:1px solid #222;
	border-radius: 100px;
	box-shadow:0 0 20px rgba(0,0,0,0.1);
	transform-origin: 50% 0%;
	animation:shake 6s 0.5s infinite;
}
.ticket_btn .one{top:150px;}
.ticket_btn:hover{
	transform: rotate(0deg);
	animation-play-state: paused;
}
.ticket_btn a{
	padding-top:70px;
	background:url(/site/noctemare/images/main/ticket_icon.png) no-repeat center 35%;
	border-radius:100px;
	height:100%;
	box-sizing:border-box;
	display: block;
	position:relative;
	overflow:hidden;
	transition:color 1s 0.5s,background-image 1s 0.5s;
}
.ticket_btn:hover a{
	color:#fff;
	background-image:url(/site/noctemare/images/main/ticket_icon_hover.png);
	background-color:none;
}
.ticket_btn::before{
	content:"";
	display:block;
	width:7px;
	height:7px;
	background:#fff;
	border:1px solid #222;
	border-radius:50%;
	position:absolute;
	left:50%;
	transform:translate(-50%,-50%)
}
@keyframes shake{
	0%{
		transform: rotate(0deg);
	}
	5%{
		transform: rotate(30deg);
	}
	10%{
		transform: rotate(-30deg);
	}
	15%{
		transform: rotate(15deg);
	}
	20%{
		transform: rotate(-15deg);
	}
	25%{
		transform: rotate(5deg);
	}
	30%{
		transform: rotate(-5deg);
	}
	35%{
		transform: rotate(0deg);
	}
	100%{
		transform: rotate(0deg);
	}
}

/***main_box - 메인이미지***/
.main_con{
	width:100%;
	height:1080px;
	box-sizing: border-box;
	padding-top:80px;
	overflow: hidden;
	font-size:90px;
	font-weight: 900;
	position: relative;
}
.main_con h2{
	width: 100%;
	text-align: center;
	position: fixed;
	z-index: 10;
	top:50%;
	left:0;
	transform: translateY(-40%);
}
.main_con h2 span{
	display: inline-block;
}
.main_con h2 span.noc_txt{
	position: relative;
	left:0;
}
.noc_txt span{
	font-size:50px;
	font-weight: 500;
}
/*
foreignObject{
	transform-origin: 50% 50%;
	position: relative;
	overflow: hidden;
}
foreignObject::after{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background:url(/images/main/video_bg.png) no-repeat center center;
	background-size: cover;
	z-index: 100000;
}
*/

/*mainCon01 - 빛과 기억의 공간 녹테마레*/
.mainCon01{
	position: relative;
	background: url('/site/noctemare/images/main/con01_bg.png') center bottom;
	background-size: cover;
	color:#fff;
	padding:200px 0 900px 0;
	overflow: hidden;
	box-shadow: 0 -5px 50px rgb(255 255 255 / 10%);
}
.mainCon01 h2,.con01_txt{
	display: inline-block;
	vertical-align: top;
}
.mainCon01 h2{
	position: relative;
	z-index: 0;
}
.mainCon01 h2 .tit_light{
	width:217px;
	height: 186px;
	display: block;	
	content: "";
	position: absolute;
	left:-105px;
	top:-70px;
	background:url(/site/noctemare/images/main/light_img.png) no-repeat left top;
	z-index: -1;
}
.mainCon01 h2 span{
	display: inline-block;
}
.mainCon01 .wave{
	position: absolute;
	top:0;
}
.con01_txt{
	width:100%;
	line-height: 35px;
	box-sizing: border-box;
}
.con01_txt p{
	overflow: hidden;
}
.con01_txt span{
	display: block;
	transform: translateY(40px);
}
.con01_txt .txt_line{
	display: inline;
}
.con01_txt h2 span:first-child{
	font-size: 50px;
	font-weight: 500;
}

/*물결*/  
#main_video{
	position: relative;
	left:0;
	top:0;
	z-index: 100;
	width: 100%;
	box-sizing: border-box;
	background:#050708;
}
#main_video video{
	width: calc(100%);
	position: absolute;
}
#m_main_video video{
	height: 50vh;
}

/*mainCon02 - 전시slide*/
.mainCon02{
	margin-top:-780px;
	position: relative;
}
.mainCon02 .slider-for{
	width:1100px;
	height:500px;
	background:#000;
	border:2px solid #373737;
	position: relative;
}
.mainCon02 .slider-for .slick-list{height:100%;}
.mainCon02 .slider-for .slick-track,
.mainCon02 .slider-for .slick-track>div>div{
	height:100%;
}
.mainCon02 .slider-nav{width:1100px;}
.mainCon02 .slider-nav .slick-slide{
	position: relative;
	cursor: pointer;
	background:#050708;
	border-radius: 10px;
	overflow:hidden;
    border:2px solid #373737;
}
.mainCon02 .slider-nav .slick-slide h3{
	width:100%;
	text-align: center;
	position: absolute;
	z-index: 100;
	bottom:0;
	line-height: 200px;
	color:#fff;
	font-weight: normal;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}
.zone_area{
	position: relative;
	box-sizing: border-box;
}
.zone01{
	background:url(/site/noctemare/images/main/zone01.jpg) no-repeat center center;
}
.zone02{
	background-image: url(/site/noctemare/images/main/zone02.jpg);
}
.zone03{
	background-image: url(/site/noctemare/images/main/zone03.jpg);
}
.zone04{
	background-image: url(/site/noctemare/images/main/zone04.jpg);
}
.zone05{
	background-image: url(/site/noctemare/images/main/zone05.jpg);
}
.zone06{
	background-image: url(/site/noctemare/images/main/zone06.jpg);
}
.zone07{
	background-image: url(/site/noctemare/images/main/zone07.jpg);
}
.zone08{
	background-image: url(/site/noctemare/images/main/zone08.jpg);
}
.zone09{
	background-image: url(/site/noctemare/images/main/zone09.jpg);
}

.zone_area h3{
	font-size:90px;
	line-height: 80px;
	font-weight:900;
	letter-spacing: -5px;
}
.zone01 h3{color:#b351d6;}
.zone02 h3{color:#7032ad;}
.zone03 h3{color:#4c51b5;}
.zone04 h3{color:#3800c3;}
.zone05 h3{color:#2a9b03;}
.zone06 h3{color:#742df3;}
.zone07 h3{color:#876c97;}
.zone08 h3{color:#e39f3e;}
.zone09 h3{color:#5fbcb4;}
.zone_area h3 span{
	color:#000000;
	font-weight: 900;
}
.mainCon02 .slider-nav .on{
	opacity: 0.3;
	transition: opacity 0.5s;
}
.mainCon02 .slider-nav .slick-slide:hover .on{
	opacity: 1;
}
.mainCon02 .slick-initialized .slick-slide.slick-current .on{
	opacity:1;	
}
.mainCon02 .slider-for .slick-track .zone_txt{
	width:450px;
	position: relative;
	height: 100%;
	background:rgba(255,255,255,0.9);
	padding:50px;
	box-sizing: border-box;
	letter-spacing: -1px;
}
.zone_txt .zone_s_txt{
	height: auto;
	font-size:16px;
	position: absolute;
	bottom:50px;
	color:#000;
}
.zone_s_txt h4{
	font-size:22px;
	margin-bottom: 20px;
}
.zone_txt span{
	display: block;
	color:#5d5d5d;
	font-weight: 500;
}
.mainCon02 .slider-for .slick-track .zone_img{
	position: absolute;
	top:50px;
	right:50px;
	height: 400px;
}
.zone_img img{height: 100%;}
.slider-nav .slick-list{margin:0 -18px;}
.slider-nav{
	margin-top:36px;
	position: relative;
}
.slider-nav img{
	width:auto;
	height:200px;
	box-sizing: border-box;
	transform: translateX(-50%);
}
.slider-nav .slick-slide{
	margin:0 18px;
}
.slide-arrow{
	position: absolute;
	font-size:20px;
	font-weight: 900;
	font-style: italic;
	cursor: pointer;
	top:50%;
	transform: translateY(-50%);
	color:#fff;
}
.slide-arrow.prev-arrow{
	left:-80px;
}
.slide-arrow.next-arrow{
	right:-80px;
}


/*mainCon03 - infomation*/
div.info_pop{
	height: 500px;
	overflow-y: auto;
	border-radius: 0;
	position: relative;
	z-index: 0;
}
.info_pop::-webkit-scrollbar{
	width:10px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
}
.info_pop::-webkit-scrollbar-thumb{
	width:10px;
	background:#25247b;
	border-radius: 10px;
}
.info_pop h3,.info_pop p{
	line-height: normal;
}
.info_pop p,.info_txt>div{
	border-bottom: 1px solid #ddd;
	padding:15px 0;
}
.info_pop p:last-child,.info_txt>div:last-child{border-bottom: 0;}
.info_pop p span{
	display: block;
}
.info_pop .info_close,.flow_pop .info_close{
	background-image: url(/site/noctemare/images/main/info_close.png);
	position: absolute;
	right:20px;
	top:20px;
	margin-top:0;
}
.info_pop .info_close:hover,.flow_pop .info_close:hover{
	background-image: url(/site/noctemare/images/main/info_close_w.png);
}
.info_txt p b{
	position: relative;
	display: inline-block;
	z-index: 0;
}
.info_txt p b::after{
	content: "";
	display: block;	
	width:100%;
	height: 7px;
	background:rgba(106, 104, 255, 0.2);
	border-radius: 10px;
    position: absolute;
    bottom: 4px;
	z-index: -1;
}
.infomaiton{
	width: 100%;
	overflow: hidden;
	padding-top:50px;
}
.infomaiton>div{
	width:33.33%;
	padding:50px;
	box-sizing: border-box;
	height: 600px;
	float:left;
	box-shadow: -5px -5px 15px rgba(121, 81, 81, 0.05);
	position: relative;
	transition:box-shadow 0.5s;
}
.infomaiton>div[data-aos^=fade][data-aos^=fade]{
	transition-property:box-shadow;
}
.infomaiton>div:hover{
	box-shadow: -5px -5px 20px rgba(37, 36, 123, 0.10);
}
.infomaiton ul{
	position: absolute;
	right:50px;
	bottom:100px;
	overflow: hidden;
}
.infomaiton>div>h3{
	font-size:30px;
	line-height: 35px;
	font-weight: 400;
}
.infomaiton>div>h3>span{
	display: block;
	font-weight: 700;
}
.infomaiton h4,.infomaiton p{
	display: inline-block;
	vertical-align: middle;
}
.infomaiton h4{
	font-size:25px;
	font-weight: 700;
	text-align: left;
}
.infomaiton p{
	font-size:22px;
}
.infomaiton li span,.infomaiton .sale_list p{display: block;}
.infomaiton .sale_list h4{text-align: right;}
.infomaiton .small_list{
	padding:10px 20px;
	background:#f9f9f9;
	margin-top: 20px;
}
.infomaiton .small_list h4{
	vertical-align: top;
	font-size:20px
}
.infomaiton .small_list p{
	vertical-align: top;
	font-size:14px;
	display: block;
}
.info_arrow,.info_close{
	width: 45px;
	height: 45px;
	border: 2px solid #373737;
	background:url(/site/noctemare/images/main/info_arrow.png) no-repeat center center;
	cursor: pointer;
	text-indent: -9999px;
	margin-top: 30px;
	position: relative;
	overflow: hidden;
	transition: background 1s;
}
.info_arrow .one,.info_close .one,.ticket_btn .one{
	position: absolute;
    content: '';    
    left: 50%;
    width: 20em;
    height: 20em;
    opacity: 1;
    background: rgb(15, 7, 131);
    margin-left: -10em;
    border-radius: 42.5%;
    transform-origin: 50% 50%;
    transition: all 2s ease, top 2s ease;
	z-index: -1;
}
.info_arrow .one,.info_close .one{top: 84px;}
.info_arrow:hover,.info_close:hover{
	background:url(/site/noctemare/images/main/info_arrow_w.png) no-repeat center center;
}
.info_arrow:hover .one,.info_close:hover .one,.ticket_btn:hover .one{
	top: 0;
	animation: wave 2s linear;
}
@keyframes wave {
	0% {
		transform: rotate(0deg) scale(1);
	}
	50% {
		transform: rotate(180deg) scale(0.975);
	}
	100% {
		transform: rotate(360deg) scale(1);
	}
}
.infomaiton .faq{
	line-height: 20px;
	position: static;
}
.faq p{
	font-size:16px;
	display: block;
}
.faq p span{display: block;}
.faq p b{color:#25247b}
.faq_l,.faq_r{
	width:45px;
	height: 45px;
	background:url(/site/noctemare/images/main/faq_arrow_l.png) no-repeat center center;
	border:2px solid #373737;
	position: absolute;
	top: 50px;
	transform: translateY(0);
}
.faq_l{
	right:97px;
}
.faq_r{
	background-image: url(/site/noctemare/images/main/faq_arrow_r.png);
	right:50px;
}
.infomaiton .slick-dots li{
	float:left;
	margin-left:5px;
}
.infomaiton .slick-dots button{
	border:0;
	background: none;
	cursor: pointer;
	font-size:0;
	color:#ccc;
	width: 30px;
	height: 7px;
	border:1px solid #000;
	display: block;
	padding:0;
}
.infomaiton .slick-dots .slick-active button{
	background:#25247b;
}

/*mainCon04 - 층별안내*/
.mainCon04{
	position: relative;
	width:100%;
	overflow-x: clip;
	height:700px;
	background:#fff;
	box-shadow:-5px -5px 15px rgb(121 81 81 / 5%);
}
.mainCon04 h2{padding:50px 0;}
.con04_img{
	width:600px;
	height:600px;
	overflow: hidden;
}
.con04_img img{display: none;}
.con04_img img.active{display: block;}
.con04_img>div{
	float:left;
}
.con04_list{
	width:260px;
	padding-right:50px;
	float:left;
}
.con04_list li{
	color:#222;
	font-size:30px;
	line-height: 100px;
	border-bottom: 1px solid #fff;
	text-align:right;
	transition:color 0.5s;
	cursor: pointer;
}
.con04_list li.active{
	background:#fff;
	color:rgb(15, 7, 131);
	font-weight: bold;
	text-indent: 30px;
	text-indent:0;
	position:relative;
}
.con04_list li.active::after{
	content:""; 
	display:block; 
	position:absolute; 
	right:-65px; 
	top:50%; 
	margin-top:-10px; 
	width:20px; 
	height:20px;
	border-radius:50%;
	background:#2d2565;
}
.con04_list li.active h3::after{
	content:""; 
	display:block; 
	position:absolute; 
	right:-65px; 
	top:50%; 
	width:60px; 
	height:1px; 
	background:#2d2565;
}
.con04_list li.active h3{font-weight:bold;}

.con04_list li.flow_1f_li{line-height:45px;}
.con04_list li.flow_1f_li span{display: block;}
.con04_list h3,.con04_list p{
	display: inline-block;
}
.con04_list h3{font-weight:normal;}
.flow_on{
	width:559px;
	height: 570px;
	position: absolute;
	top:0;
	left:0;
	z-index: 10;
}
.flow_on img{
	position: absolute;
	opacity: 0;
	left:11px;
}
.on_3f{top:0;}
.on_2f{top:180px;}
.on_1f{bottom:28px;}
.flow_on .on_B1f{bottom:0px; left:0;}
.flow_on img.active{
	opacity: 1;
	animation: flow 1s;
}
@keyframes flow{
	0%{opacity: 0;}
	25%{opacity: 1;}
	50%{opacity: 0;}
	100%{opacity: 1;}
}

/*mainCon05 - 오시는길 지도*/
#map{
	width:100%;
	height: 650px;
	outline: none;
}
.grayscale > div > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1),
.grayscale > div > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) {
	filter         : grayscale(90%) contrast(90%) invert(90%);
	-webkit-filter : grayscale(90%) contrast(90%) invert(90%);
}
#map .map_box{
	width: 280px !important;
	height: 90px !important;
	padding:20px;
	font-size: 16px;
	box-sizing: border-box;
	text-align: center;
}

/*팝업관련*/
.navi_pop_wrap,.info_pop_wrap,.covid_pop_wrap{
	position: fixed;
	left:0;
	top:0;
	width:100%;
	height: 100%;
	z-index: 10000;
	display: none;
}
.navi_pop_bg,.info_pop_bg,.flow_pop_bg,.covid_pop_bg{
	width: 100%;
	height: 100%;
	position: fixed;
	left:0;
	top:0;
	background:rgba(0,0,0,0.7);	
}
.navi_pop, .covid_pop{
	line-height: 40px;
	padding:20px;
	background:#fff;
	position: absolute;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
	border-radius: 20px;
}
.info_radius,.covid_info_radius{
	position: absolute;
    border-radius: 20px;
    overflow: hidden;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
}
.info_pop{
	line-height: 40px;
	padding:50px;
	background:#fff;
}
.navi_pop img,.navi_pop img{
	vertical-align: middle;
}
.navi_pop img{
	width:30px;
	margin-right:10px;
}

/*코로나 방역버튼*/
.covid_btn{
	width:180px;
	background:#25247b;
	color:#fff;
	padding:10px;
	border-radius: 30px;
	text-align: center;
	font-size:16px;
	margin:10px 0 0 auto;
	cursor: pointer;
}

/*opentext 추가작업*/
.open_txt{
	width:620px;
	margin:0 auto;
	text-align: center;
	font-size:40px;
	background:#fff;
	color:#211816;
}
.open_txt span{font-size:25px;}
span.grand_open{
	display: inline-block;
	position: relative;
	font-size:40px;
	margin-left:30px;
}

/*층별팝업추가작업*/
.flow_pop_wrap{
	width:520px; 
	height:460px; 
	padding:30px; 
	box-shadow:0px 0px 30px rgb(121 81 81 /7%); 
	bottom:0; 
	box-sizing:border-box; 
	z-index: 0;
	display: block;
	position: absolute;
	right:0;
	display: block;
	background:#fff;
}
.flow_pop{
	width:100%;
	box-sizing: border-box;
	position: relative;	
}
.flow_info{display: none;}
.flow_info.active{display: block;}
.flow_info h3,.flow_info h4{font-size:36px;}
.flow_info h3{
	color:#2d2565; 
	font-weight:900;
}
.flow_pop .info_close{
	top:0;
	right:0px;
}
.flow_info h4{
	color:#25247b;
	font-size:26px;
	margin-bottom:30px; 
	font-weight:normal;
}
.flow_info p{
	font-size:20px; 
	line-height:30px; 
	word-break: keep-all;
}
.flow_info p span{display: block;}

/* 팝업 추가부분 22-05-26 */
.pop_wrap{
	position: fixed;
	width:100%;
	height:100%;
	left:0;
	top:0;
	z-index: 1000;
	background:rgba(0,0,0,0.3);
}
.pop_con_wrap{
	width:30%;
	height: auto;
	background:#fff;
	position: absolute;
	right:5%;
	top:5%;
	border-radius: 15px 15px 0 0;
	border:1px solid #ddd;
	overflow: hidden;
}
.pop_con_wrap .slick-dots2 {width:100%; position:absolute; bottom:5px; text-align:center;}
.pop_con_wrap .slick-dots2 li button{
	width:10px;
	height: 10px;
	border:1px solid #000;
	border-radius: 50%;
	text-indent:-9999px;
	padding:0;
	cursor: pointer;
}
.pop_con_wrap .slick-dots2 li{
	display:inline-block;
	margin:0 3px;
}
.pop_con_wrap .slick-slide img{width: 100%;}
.pop_con_wrap .slick-active button{background:#000;}
.pop_con_wrap .slick-list{overflow: hidden;}
.pop_con>a{
	height:400px;
	overflow-y: auto;
	display: block;
	padding:30px;
}
.pop_btn{
	width:100%;
	height:40px;
	line-height:40px;
	font-size:11px;
	background:#fff;
	z-index: 1000;
}
.pop_btn li{
	width:50%;
	float:left;
	text-align: center;
	background:#eee;
	border:1px solid #ddd;
	border-right: 0;
}
.pop_btn li:first-child{border-left: 0;}
.pop_btn li:last-child{
	background:#fff;
	box-sizing: border-box;
}
.pop_btn li a{display: block;}


/*영문버전*/
.con04_list.eng li{font-size:25px;}