/* 4분할 */
.expend{
	width			: 100vw;
	height			: 100vh;
	display			: flex;
}
.expend li{
	width			: 25%;
	height			: 100%;
}
.expend li{
	width			: 25%;
	height			: 100%;
	position		: relative;
	top				: 0;
	left			: 0;
}
.expend li .bgShield{
	background-color: rgba(0,0,0,0.6);
	width			: 100%;
	height			: 100%;
	cursor			: pointer;
}

.expend li .bgShield:hover{
	background-color: rgba(0,0,0,0);
}

.expend li .bgShield .expendInfoWrap{
	width			: 140px;
	height			: 60px;
	padding			: 10px 20px;
	border			: 1px solid #fff;
	text-align		: center;
	vertical-align	: middle;
	font-weight		: 700;
	font-size		: 14px;
	color			: #fff;
	position		: absolute;
	top				: 50%;
	left			: 50%;
	transform		: translate(-50%, -50%);
	-webkit-transform		: translate(-50%, -50%);
	box-sizing		: border-box;
}
.expend li .bgShield .expendInfoWrap span{
	position		: absolute;
	top				: 50%;
	left			: 50%;
	transform		: translate(-50%, -50%);
	-webkit-transform		: translate(-50%, -50%);
	box-sizing		: border-box;
}

.expend li .bgShield .expendInfoPlus{
	width			: 50px;
	height			: 50px;
	border			: 1px solid #fff;
	border-radius	: 100px;
	text-align		: center;
	vertical-align	: middle;
	font-weight		: 700;
	font-size		: 14px;
	color			: #fff;
	position		: absolute;
	top				: 60%;
	left			: 50%;
	transform		: translate(-50%, -50%);
	box-sizing		: border-box;
	padding			: 10px;
}

.expend li .bgShield .expendInfoPlus img{
	width			: 30px;
	position		: absolute;
	top				: 50%;
	left			: 50%;
	transform		: translate(-50%, -50%);
	box-sizing		: border-box;
}



/* roomView */
#roomViewTitle{
	font-size		: 80px;
	font-weight		: 700;
	color			: #fff;
	position		: absolute;
	top				: 15%;
	left			: 50%;
	transform		: translate(-50%, -50%);
}
#roomViewTitle span{
	color			: #ee0000;
}

#roomViewWrap{
	width			: 90%;
	position		: absolute;
	top				: 50%;
	left			: 50%;
	transform		: translate(-50%, -50%);
}

#roomViewUl{
	font-size:14px;
}

#roomViewUl li{
	padding			: 20px;
	background-color: #fff;
	box-sizing		: border-box;
	text-align		: center;
	color			: #666;
}

#roomViewUl li .roomName{
	font-size		: 18px;
	font-weight		: 700;
	margin			: 10px 0 10px 0;

}

/***********************
	etcMenuWrap 
************************/

#etcMenuWrap.etcMenuWrap {
	position			: fixed !important;
	top					: 50% !important;
	right				: 0 !important;
	transform			: translateY(-50%) !important;
	-webkit-transform	: translateY(-50%) !important;
	width				: 60px !important;
	height				: auto !important;
	z-index				: 3 !important;
}


#etcMenuWrap.etcMenuWrap > * {
	width				: 100% !important;
	height				: 60px !important;
}

#etcMenu.etcMenu {
	background-color	: #5e7b82 !important;
}

#etcMenuWrap.etcMenuWrap > div {
	background-color	: #fff !important;
}

#etcMenuWrap.etcMenuWrap a{
	display				: block !important;
	width				: 100% !important;
	height				: 100% !important;
	font-size			: 21px !important;
	color				: #393939 !important;
	text-align			: center !important;
	line-height			: 60px !important;
	font-weight			: bold !important;
}


/*
	인덱스 맵 영역
*/
#mapWrap{
	background-color	: rgba(0,0,0,0.5);
	position			: absolute;
	top					: 0;
	left				: 0;
	width				: 100%;
	height				: 100%;
}
#mapWrap #marpTitleWrap{
	height				: 20%;
}

#mapContentWrap{
	height				: 80%;
}

#mapTitle{
	font-size			: 4vh;
	font-weight			: 700;
	color				: #fff;
	position			: absolute;
	top					: 80px;
	left				: 50%;
	transform			: translate(-50%, -50%);
}
#map{
	width				: 100%;
	height				: 65%;
}

#footerInfo{
	height				: 35%;
}

#footerInfo #footerMenuUl{
	height				: 15%;
	width				: 100%;
	display				: flex;
	background-color	: rgba(78,81,88,1);
}
#footerInfo #footerMenuUl li{
	width				: 16.6666666%;
	border-right		: 1px solid #5A5D64;
	box-sizing			: border-box;
	text-align			: center;
	position			: relative;
	top					: 0;
	left				: 0;
	cursor				: pointer;
}

#footerInfo #footerMenuUl li a{
	font-size			: 15px;
	font-weight			: 600;
	color				: #fff;
	position			: absolute;
	top					: 50%;
	left				: 50%;
	transform			: translate(-50%, -50%);
}

#footerInfo #footerMenuUl li:hover{
	background			: rgba(255, 255, 255, 1);
}

#footerInfo #footerMenuUl li:hover a{
	color				: rgb(78,81,88);
}

#footerInfo #footerInfoUl{
	height				: 60%;
	width				: 100%;
	display				: flex;
	background-color	: rgba(54,55,59,1);
}

#footerInfo #footerInfoUl li{
	position			: relative;
	top					: 0;
	left				: 0;
	text-align			: center;
	width				: 25%;
}

#footerInfo #footerInfoUl li div{
	display				: inline-block;
	position			: absolute;
	top					: 50%;
	left				: 50%;
	transform			: translate(-50%, -50%);
	font-size			: 1.6vh;
	color				: #c3c3b4;
	width				: 100%;
}

#footerInfo #footerInfoUl li div img{
	width				: 2.5vw;
	margin-bottom		: 1vh;
}

#footerInfo #footerCopyrightWrap{
	height				: 25%;
	width				: 100%;
	background-color	: rgba(18,18,20,1);
	color				: #666;
	font-size			: 14px;
	position			: relative;
	top					: 0;
	left				: 0;
}

#footerInfo #footerCopyrightWrap #copyright{
	display				: inline-block;
	position			: absolute;
	top					: 50%;
	left				: 50%;
	transform			: translate(-50%, -50%);
}

#footerInfo #footerCopyrightWrap #copyright a{
	color				: #666;
}

#footerInfo #footerCopyrightWrap #adminLinkWrap{
	display				: inline-block;
	position			: absolute;
	top					: 50%;
	right				: 2%;
	transform			: translateY(-50%);
}

#footerInfo #footerCopyrightWrap #adminLinkWrap a{
	color				: #666;
}

#sns{
	width				: 8%;
	height				: 100%;
	display				: flex;
	justify-content		: space-between;
	margin				: 0 auto;
	position			: absolute;
	bottom				: -20px;
	right				: 70px;
}
#sns li{
	width				: 30px;
	height				: 30px;
	border-radius		: 5px;
	text-align			: center;
	background-color	: gray;
	box-sizing			: border-box;
	margin-top			: 5px;
	transition			: all .17s;
	font-size			: 20px;
}
#sns li:hover{
	background-color	: #000;
}
#sns > li:hover i{
	color				: gray;
	transform			: scale(1.2);
}

#sns > li:last-child > a > img {
	box-sizing			: border-box;
	margin-top			: 6px;
	width				: 60%;
	transform			: scale(1);
}

#sns > li:hover > a > img{
	transform			: scale(1.2);
}

#map #category {
	bottom				: 6vh !important;
}

/* 1p - 동영상일 경우 layer */
#layer {
	width				: 100vw;
	height				: 100vh;
	/* background-color	: rgba(0, 0, 0, 0.5); */
	background			: url('/main/images/common/icon/videoBg.png');
	position			: absolute;
	top					: 0;
	left				: 0;
	z-index				: 1;
}


/* footer */
.footerTypeB footer{
	background-color			: #191919;
}

.footerTypeB #footerTop{
	width: 100vw;
	height: 20vh;
	border-top: 1px solid #6d6d6d;
}

.footerTypeB #footerTop_wrap {
	width: 36vw;
	height: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}

.footerTypeB .footerTop_wrapBox {
	width: 12vw;
	height: 100%;
}
.footerTypeB .footerTop_wrapBox>img {
	display: block;
	height: 20%;
	margin: 30% auto 0;
}
.footerTypeB .footerTop_wrapBox>p {
	text-align: center;
	font-size: 0.8vw;
	padding-top: 1.5vh;
	color: #eeeeee;
	font-weight: normal;
}

.footerTypeB #footerBottom {
	width: 100vw;
	height: 21vh;
	border-top: 1px solid #393939;
}

.footerTypeB #footerBottom_wrap {
	width: 72vw;
	height: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}

.footerTypeB #footerBottom_wrapLeft {
	width: 28vw;
	height: 100%;
}
.footerTypeB #footerBottom_wrapLeftBox {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.footerTypeB #footerBottom_wrapLeftBox>p {
	text-align: right;
	font-size: 0.8vw;
	padding-right: 1vh;
	color: #eeeeee;
}
.footerTypeB #footerBottom_wrapLeftBox>p:last-child {
	font-size: 0.7vw;
	color: #cfcfcf;
	padding-top: 2vh;
}
.footerTypeB #footerBottom_wrapLeftBox>p:nth-child(2) {
	padding-bottom: 2vh;
}
.footerTypeB #footerBottom_wrapCenter {
	width: 18vw;
    height: 100%;
}
.footerTypeB #footerBottom_wrapCenter>img {
	height: 40%;
	margin: 0 auto;
	display: block;
	position: relative;
	top: 20%;
}
.footerTypeB #footerBottom_wrapRight {
	width: 28vw;
    height: 100%;
}
.footerTypeB #footerBottom_wrapRightBox {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.footerTypeB #footerBottom_wrapRightBox>p:first-child {
	text-align: left;
	font-size: 0.8vw;
	color: #eeeeee;
	padding: 0 0 2vh 1vh;
}
.footerTypeB #footerBottom_wrapRightBox>p:last-child {
	padding-left: 1vh;
}
.footerTypeB #footerBottom_wrapRightBox>p:last-child>img {
    margin-right: 1vh;
    width: 1.8vw;
    cursor: pointer;
}
.footerTypeB #admin {
    position: absolute;
    bottom: 23px;
    right: 60px;
    z-index: 999;
}
.footerTypeB #admin a {
    color: gray;
    font-size: 14px;
}

/* enterBar */
#enterBar {
	position			: fixed;
	left				: 50%;
	-webkit-transform			: translateX(-50%);
	transform			: translateX(-50%);
	bottom				: 3%;
	width				: 1000px;
	height				: 60px;
	z-index				: 3;
}

#enterBar:after {
	display				: block;
	clear				: both;
	content				: '';
}

#enterBar li {
	float				: left;
	width				: 33.3333%;
	height				: 100%;
}

#enterBar li:nth-child(2) {
	background-color	: rgba(117, 174, 180, 0.8);
}

#enterBar li:nth-child(2) a {
	color				: #fff;
}

#enterBar li:not(:nth-child(2)) {
	background-color	: rgba(255,255,255,0.8);
}

#enterBar li a {
	display				: block;
	width				: 100%;
	height				: 100%;
	font-size			: 14px;
	color				: #5c5c5e;
	text-align			: center;
	line-height			: 60px;
}