/*********************************
    css/common.css
*********************************/

* {
	margin			: 0;
	padding			: 0;
	font-family		: 'Nanum Gothic', sans-serif;
	border			: 0;
}

ul, img{
	font-size		: 0;
}

li {
	list-style		: none;
}

a {
	text-decoration	: none;
	color			: #000;
}

html,
body {
	width			: 100vw;
	font-size		: 14px;
	overflow-x		: hidden;
}

/***********************
	fullImg 
************************/
.fullImg {
	width			: 100%;
	min-height		: 100%;
} 

#bodyWrap{
	font-size		: 14px;
}

/***********************
	fullImg 
************************/
.fullImg {
	width			: 100%;
	min-height		: 100%;
} 

/***********************
	각페이지 topSlogan
************************/
.topSlogan {
	width				: 100%;
	left				: 0;
	top					: 0;
}


/**********************
	헤더
********************* */
.headerWrap{
	position		: fixed;
	top				: 0;
	left			: 0;
	width			: 100%;
	height			: 50px;
	z-index			: 2000;
}

/***********************
	logWrap 
************************/
#logWrap{
	display			: inline-block;
	width			: 10%;
	height			: 50px;
	z-index			: 2100;
	position		: absolute;
	top				: 0;
	left			: 0;
	text-align		: center;
}

/***********************
	mainMenuWrap 
************************/
#mainMenuWrap{
	position			: absolute;
	top					: 0;
	left				: 0;
	width				: 100%;
	height				: 50px;
	background-color	: rgba(0, 0, 0, 0.7);
}

#mainMenu{
	width				: 60%;
	height				: 100%;
	margin				: 0 auto;
	font-size			: 0;
}

#mainMenu li{
	font-size			: 14px;
	width				: 12.5%;
	height				: 100%;
	text-align			: center;
	display				: inline-block;
	position			: relative;
	top					: 0;
	left				: 0;
	cursor				: pointer;
}

#mainMenu li > a{
	position			: absolute;
	top					: 50%;
	transform			: translateY(-60%);
	left				: 0;
	width				: 100%;
	color				: #fff;
	font-weight			: 700;
}

#mainMenu > li ul {
	position			: absolute;
	top					: 50px;
	left				: 50%;
	height				: auto;
	transform			: translateX(-50%);
	display				: none;
	background			: rgba(0,0,0,0.7);
}

#mainMenu > li ul li {
	display				: block;
	width				: 100%;
	height				: 42px;
	text-align			: center;
	padding				: 10px 20px;
	white-space			: nowrap;
	position			: relative;
	color				: #fff;
	box-sizing			: border-box;
}

#mainMenu > li ul li a{
	position			: relative;
	top					: 50%;
	transform			: translateY(-50%);
	left				: 0;
	display				: block;
	white-space			: nowrap;
	padding				: 10px 40px;
	box-sizing			: border-box;
}

#mainMenu > li ul li:hover{
	background			: rgba(255, 255, 255, 0.7);
	color				: #000;
}
#mainMenu > li ul li:hover a{
	color				: #000;
}


  

/***********************
	etcMenuWrap 
************************/
#etcMenuWrap{
	position			: absolute;
	top					: 0;
	right				: 0;
	display				: flex;
	height				: 100%;
}

#etcMenuWrap #reservation{
	position			: relative;
	top					: 0;
	left				: 0;
	width				: 100px;
	height				: 100%;
	background-color	: #fff;
}

#etcMenuWrap #reservation a{
	font-size			: 16px;
	position			: absolute;
	top					: 50%;
	transform			: translateY(-60%);
	left				: 0;
	width				: 100%;
	color				: #fff;
	font-weight			: 700;
	text-align			: center;
	color				: rgb(124, 124, 124);
}

#etcMenuWrap #reservation a:hover{
	text-shadow			: 2px 1px 1px #444;
	color				: #fff;
}

#etcMenuWrap #etcMenu{
	width				: 50px;
	height				: 100%;
	position			: relative;
	top					: 0;
	left				: 0;
	background-color	: #7c7c7c;
	cursor				: pointer;
}

#etcMenuWrap #etcMenu img{
	position			: absolute;
	top					: 50%;
	left				: 50%;
	transform			: translate(-50%, -50%);
}



/*
 pull page 스크롤 스타일
*/

#main_menu {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	right: 1vw;
	z-index: 99;
}

#main_menu > li {
	width: 16px;
	height: 16px;
	background-image: url('/main/images/common/icon/sidenav_white.png');
	background-position: right;
	background-repeat: no-repeat;
	margin-top: 1vh;
	transition: all 0.3s;
}

#main_menu > li.active {
   background-image: url('/main/images/common/icon/sidenav_red.png'); 
}

#main_menu > li > a {
display: block;
width: 100%;
height: 100%;
}



/*
	전화면 다 채우는 레이어
*/
.infoPlusInfo{
	z-index				: 50;
	position			: absolute;
	top					: 50%;
	left				: 5%;
	transform			: translateY(-50%);
	cursor				: pointer;
}

.infoMinusInfo{
	z-index				: 1050;
	position			: absolute;
	top					: 50%;
	right				: 5%;
	transform			: translateY(-50%);
	cursor				: pointer;
}

.infoWrap{
	z-index				: 1000;
	position			: absolute;
	left				: -100%;
	width				: 100%;
	height				: 100%;
	background-color	: rgba(255, 255,255, 0.9);
}

.infoContentsWrap{
	z-index				: 1050;
	position			: absolute;
	top					: 50%;
	left				: 50%;
	transform			: translate(-50%, -50%);
}

.infoTitleWrap{
	font-size			: 30px;
	color				: #4b4b4b;
	font-weight			: 700;
	text-align			: center;
	margin-bottom		: 50px;
}

.infoImgWrap{
	z-index				: 1050;
	width				: 18vw;
	height				: 18vw;
	min-width			: 12vh;
	min-height			: 12vh;
	border-radius		: 50%;
	background-position	: center;
	background-size		: cover;
	margin				: auto;
}

.infoContentWrap{
	width				: 50vw;
	height				: 25vh;
	overflow-y			: auto;
	margin-top			: 50px;
}



/**********************
	이미지 슬라이드 좌우 화살표
********************* */
.fp-controlArrow {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
    position: absolute;
    z-index: 4;
    top: 50%;
    cursor: pointer;
    height: 59px;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.fp-controlArrow.fp-prev {
	left				: 15px;
    width				: 260px;
	background-image	:url(/main/images/common/icon/arrow_prev.png);
}
.fp-controlArrow.fp-next {
	right				: 90px;
    width				: 235px;
	background-image	:url(/main/images/common/icon/arrow_next.png);
}

/* 메인페이지 슬로건 */
.mainSlogan {
	position			: absolute;
	bottom				: 10vh;
	left				: 50%;
	transform			: translateX(-50%);
	z-index				: 3;
}

.mainSlogan1{
	top					: 50%;
	bottom				: unset;
	transform			: translate(-50%, -50%);
}

/* scroll */
#scroll {
	position			: fixed;
	bottom				: 1vh;
	left				: 50%;
	transform			: translateX(-50%);
	z-index				: 5;
}

/***********************
	media 
************************/
@media screen and (max-width: 1400px) {

	#mainMenu {
		width: 75%;
	}

	#mainMenu li {
		font-size: 13px; 
	}

}