@charset "UTF-8";
@import url("https://use.typekit.net/quq1vxz.css");

/*------ woc - base ------*/


@font-face {
	font-family: 'Noto Sans';
	font-style: normal;
	src: url('../font/NotoSans-Regular.eot');
	src: url('../font/NotoSans-Regular.ttf');
	src: url('../font/NotoSans-Regular.woff');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center,dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, article, aside, canvas, details, embed, figure, figcaption, footer, header,
hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{
	margin:0;border:0;outline:0;padding:0;
	background:transparent;
	font-family:'Noto Sans','noto-sans-cjk-kr', 돋움, Dotum, sans-serif;
	font-style:normal; font-weight:normal;
	vertical-align:baseline;
}


article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

body					{line-height:1}
ol,ul				{list-style:none}
blockquote,q 		{quotes:none}
blockquote:before,
blockquote:after,
q:before,q:after		{content:'';content:none}
table				{border-collapse:collapse;border-spacing:0}
hr					{display:none}
button				{border:none;background:none;}
label				{vertical-align:middle;cursor:pointer}
input				{vertical-align:middle}

a:link				{color:#000;text-decoration:none}
a:visited			{color:#000;text-decoration:none}
a:hover				{color:#000;text-decoration:none}
a:active				{color:#000;text-decoration:none}

/* common - mov */
#MainVideo {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;/*z-index:30;*/height:auto;overflow:hidden;object-fit:cover;}
#myVideo {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;/*z-index:30;*/height:auto;overflow:hidden;object-fit:cover;}
#sub_vid {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;/*z-index:30;*/height:auto;overflow:hidden;object-fit:cover;}

/* element hide */
#skipnavi,.hide,.alt		{position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;visibility:hidden;overflow:hidden}
.bg {display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.3;}
.bg_01 {display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.4;}
.bg_02 {
	display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.5;
	-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;
}


/* element slide */
#slide 						{position:relative;width:100%;height:100%;overflow:hidden;min-width:1200px;min-height:650px;}
#slide .slide_show 			{position:relative;width:100%;height:100%;overflow:hidden;min-height:650px;}
#slide .slide_show > li 		{position:absolute;top:0;left:0;width:100%;height:100%;min-height:650px;overflow:hidden;}
#slide .slide_show > li.active {z-index:320;}

#index #slide .nav > a 				{position:absolute;top:50%;margin-top:-26px;width:48px;height:52px;z-index:320;}
#index #slide .nav > a.prev 			{left:0;background:url(../images/prev.png) no-repeat 0 0;}
#index #slide .nav > a.next 			{right:0;background:url(../images/next.png) no-repeat 0 0;}

#room #slide .nav > a 				{position:absolute;top:50%;margin-top:-35px;width:40px;height:70px;z-index:320;}
#room #slide .nav > a.prev 			{left:3%;background:url(../images/room/prev.png) no-repeat 0 0;}
#room #slide .nav > a.next 			{right:3%;background:url(../images/room/next.png) no-repeat 0 0;}

#slide .nav > ul 				{position:absolute;left:50%;bottom:10%;z-index:320;}
#slide .nav > ul li 			{float:left;width:12px;margin:0 3px;}
#slide .nav > ul li a 		{width:12px;height:12px;display:block;margin:0 auto;}
#slide .nav > ul li a 		{background:url(../images/base.png) no-repeat 0 0;
	-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;
}
#slide .nav > ul li a.active 	{background:url(../images/on.png) no-repeat 0 0;}

#promo_top {position:relative;top:0;width:100%;height: 90vh;}
#promo_top .back {content:'';width:100%;height:100%;position:absolute;left:0;top:0;z-index: 5;background: rgba(0,0,0,0.3);}
#promo_top h2 {
	font-size:33px;color:#ffffff;position:absolute;bottom:15%;left:50%;z-index:320;text-align: center;width: 100%;
	transform: translateX(-50%);
}
#promo_top h2 span {display:block;margin-top:20px;font-size:18px;color:#ffffff;text-align:center;}


.content {position:relative;top:0;z-index:320;}