@charset "utf-8";

/*VR Viewer Style 시작*/
#vr_wrap { background:#fff; } 

.version.index {
	color: #00000D;
	background-color: #243AF6;
}
#vr_wrap #muse_css_mq {
	background-color: #FFFFFF;
}
#vr_wrap #page {
	z-index: 1;
	min-height: 500px;
	background-image: none;
	border-width: 0px;
	border-color: #000000;
	background-color: transparent;
	width: 100%;
	max-width: 768px;
	margin-left: auto;
	margin-right: auto;
}
#vr_wrap #u216 {
	z-index: 2;
	width: 100%;
	border-width: 0px;
	border-color: transparent;
	background-color: transparent;
	position: relative;
}
#vr_wrap #u162 {
	z-index: 3;
	width: 100%;
	min-height: 500px;
	border-width: 0px;
	border-color: transparent;
	background-color: transparent;
	position: relative;
	margin-right: -10000px;
}
#vr_wrap #u163 {
	z-index: 3;
	width: 100%;
	min-height: 500px;
	border-width: 0px;
	border-color: transparent;
	background-color: transparent;
	position: relative;
	margin-right: -10000px;
}

#vr_wrap #_u162 :hover {cursor: move; }
#vr_wrap #_u162 { width: 100%; height: 500px; } 
#vr_wrap #preloader_containeru162 {position: absolute;display: table;width: 100%; height: 500px;} 
.hide_preloader_u162{ display: none !important; } 
#vr_wrap #preloader_gif_u162 { display: table-cell; vertical-align: middle; text-align: center; height: 500px;} 
.alt_img_u162 {background: url(../img/vr_img/1.jpg) center no-repeat; }

#vr_wrap #_u163 :hover {cursor: move; }
#vr_wrap #_u163 { width: 100%; height: 500px; } 
#vr_wrap #preloader_containeru163 {position: absolute;display: table;width: 100%; height: 500px;} 
.hide_preloader_u163{ display: none !important; } 
#vr_wrap #preloader_gif_u163 { display: table-cell; vertical-align: middle; text-align: center; height: 500px;} 
.alt_img_u163 {background: url(../img/vr_img/2.jpg) center no-repeat; }

#vr_wrap #button_u186{ cursor: pointer; height: 86px;width: 105px; transition:all 0.2s; }
#vr_wrap #button_u173{ cursor: pointer; height: 86px;width: 105px; transition:all 0.2s; }
#vr_wrap #button_u191{ cursor: pointer; height: 86px;width: 105px; transition:all 0.2s; }
#vr_wrap #button_u196{ cursor: pointer; height: 86px;width: 105px; transition:all 0.2s; }
#vr_wrap #button_u186:hover, #vr_wrap #button_u173:hover, #vr_wrap #button_u191:hover, #vr_wrap #button_u196:hover { border:3px solid #fff; }


#vr_wrap #u211 {
	z-index: 4;
	width: 131px;
	border-width: 0px;
	border-color: transparent;
	background-color: transparent;
	position: relative;
	margin-right: -10000px;
	left: 0px;
	display:none; /*섬네일 버튼 비활성*/
}
#vr_wrap #u205 {
	z-index: 5;
	width: 131px;
	height: 500px;
	background-color: #000000;
	opacity: 0.3;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=26)";
	filter: alpha(opacity=30);
	position: relative;
	margin-right: -10000px;
}
#vr_wrap #u173 {
	z-index: 6;
	width: 111px;
	min-height: 92px;
	border-width: 0px;
	border-color: transparent;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	position: relative;
	margin-right: -10000px;
	margin-top: 108px;
	left: 10px;
	background: transparent url("../img/vr_img/2_00.jpg?crc=3976126272") no-repeat left top;
}
#vr_wrap #u191 {
	z-index: 7;
	width: 111px;
	min-height: 92px;
	border-width: 0px;
	border-color: transparent;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	position: relative;
	margin-right: -10000px;
	margin-top: 208px;
	left: 10px;
	background: transparent url("../img/vr_img/3_00.jpg?crc=299451809") no-repeat left top;
}
#vr_wrap #u196 {
	z-index: 8;
	width: 111px;
	min-height: 92px;
	border-width: 0px;
	border-color: transparent;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	position: relative;
	margin-right: -10000px;
	margin-top: 307px;
	left: 10px;
	background: transparent url("../img/vr_img/4_00.jpg?crc=222516733") no-repeat left top;
}
#vr_wrap #u186 {
	z-index: 9;
	width: 111px;
	min-height: 92px;
	border-width: 0px;
	border-color: transparent;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	position: relative;
	margin-right: -10000px;
	margin-top: 8px;
	left: 10px;
	background: transparent url("../img/vr_img/1_00.jpg?crc=324462653") no-repeat left top;
}
.css_verticalspacer .verticalspacer {
	height: calc(100vh - 500px);
}
/*반드시 있어야하는 것v*/

.grpelem, .accordion_wrapper {
	display: inline;
	float: left;
}

/*================================ Media Query 시작================================*/
/*768 미만*/
@media all and (max-width:768px){ 

	#vr_wrap #u205 { width:100px; opacity: 0.35; }
	#vr_wrap #u186 { width:80px; height: 66px; } 
	#vr_wrap #button_u186 { width:80px; height: 66px; }
	#vr_wrap #u173 { width:80px; height: 66px; }
	#vr_wrap #button_u173 { width:80px; height: 66px; }
	#vr_wrap #u191 { width:80px; height: 66px; }
	#vr_wrap #button_u191 { width:80px; height: 66px; }
	#vr_wrap #u196 { width:80px; height: 66px; }
	#vr_wrap #button_u196 { width:80px; height: 66px; }

}
/*640 미만*/
@media all and (max-width:640px){ 
	#vr_wrap #page { min-height: 360px; }
	#vr_wrap #u205 { width: 100%; height: 108px; }
	#vr_wrap #u216 { width: 100%; }
	#vr_wrap #u162 { width: 100%; min-height: 400x; }
	#vr_wrap #_u162 { width: 100%; height: 500px; } 
	#preloader_containeru162 {position: absolute;display: table; width: 100%; height: 500px } 
	#vr_wrap #u163 { width: 100%; min-height: 360px; }
	#vr_wrap #_u163 { width: 100%; height: 360px; } 
	#preloader_containeru163 {position: absolute;display: table;width: 100%; height: 500px } 
	#vr_wrap #button_u173{ cursor: pointer; width:80px; height: 92px; }
	#vr_wrap #button_u191{ cursor: pointer; width:80px; height: 92px; }
	#vr_wrap #button_u196{ cursor: pointer; width:80px; height: 92px; }
	#vr_wrap #button_u186{ cursor: pointer; width:80px; height: 92px; }
	#vr_wrap #u211 { width: 100%; height: 108px; bottom: -360px; }
	#vr_wrap #u173 {  width: 80px; height:92px; margin: 8px 8px 8px 0; left:unset; }
	#vr_wrap #u186 { width: 80px; height:92px; margin:8px; left:unset; }
	#vr_wrap #u191 { width: 80px; height:92px; margin: 8px 8px 8px 0px; left:unset; }
	#vr_wrap #u196 { width: 80px; height:92px; margin: 8px 0px 8px 0px; left:unset; }

	/*높이갚 수정 위해 추가*/
	#vr_wrap #page { min-height: 360px; }
	#vr_wrap #u162 { min-height: 360px; }
	#vr_wrap #u163 { min-height: 360px; }
	#vr_wrap #_u162 { height: 360px; }
	#vr_wrap #preloader_containeru162 { height: 360px; }
	#vr_wrap #preloader_gif_u162 { height: 360px; }
	#vr_wrap #_u163 { height: 360px; }
	#vr_wrap #preloader_containeru163 { height: 360px; }
	#vr_wrap #preloader_gif_u163 { height: 360px; }
	#vr_wrap #u205 { height: 360px; }
	.css_verticalspacer .verticalspacer { height: calc(100vh - 360px); }
	#vr_wrap #_u162 { height: 360px; }
	#preloader_containeru162 { height: 360px; }
	#preloader_containeru163 { height: 360px; }
}
/*500 미만*/
@media all and (max-width:500px) { 
}
/*================================ Media Query 종료================================*/
/*VR Viewer Style 종료*/