.sly_box { position:relative; float:left; width:100%; height:80px; margin:9px; padding:20px 0; display:table; border:1px solid #DDD; border-radius:15px !important; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.optionTitle { position:absolute; top:-10px; left:20px; width:auto; height:20px; margin:0; padding:0 15px; color:#111; font-size:12px; font-weight:600; line-height:20px; display:inline-block; background:#FFF; z-index:99; }

#Screen { position:relative; clear:both; float:left; width:calc(100% - 20px); height:auto; margin:10px 10px 30px; padding:0; display:block; }
#Screen .scrInner { position:relative; clear:both; float:left; width:100%; height:100%; margin:0; padding:0 0 60px; overflow:hidden; display:block; background:#FFF; border-radius:0px !important; }
#Screen .scrInner .scrBox { position:absolute; top:50%; left:50%; width:100%; height:400px; margin:0; padding:0; overflow:auto; display:block; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); background:#CDC; }
ul#vmc_screen { position:relative; clear:both; float:left; top:0; left:0; width:100%; height:auto; margin:0; padding:0; overflow:hidden; display:block; background:#999; }
ul#vmc_screen:before { content: ""; padding-top:65%; display: block; }
ul#vmc_screen li { position:absolute; clear:both; top:0; left:0; width:100%; height:100%; margin:0; padding:0; overflow:hidden; display:block; }
ul#vmc_screen li.sc_bg { z-index:14; }
ul#vmc_screen li.sc_door { z-index:15; }
ul#vmc_screen li.sc_post { z-index:14; }
ul#vmc_screen li.sc_point { z-index:16; }
ul#vmc_screen li#wtMark { display:none; z-index:19; }
/**
ul#vmc_screen li#wtMark { position:absolute; clear:both; top:45%; left:35%; width:30%; max-width:240px; height:auto; margin:0; padding:0; display:none; z-index:19; }
ul#vmc_screen li#wtMark img { position:relative; clear:both; width:100%; height:auto; margin:0; padding:0; display:block; }
*/
ul#vmc_screen li.sc_loading { z-index:20; display:none; }
ul#vmc_screen li img { position:absolute; top:0; left:0; width:100%; height:auto; margin:0; padding:0; display:block; }
ul#vmc_screen li.sc_loading img { top:50%; left:50%; width:70px; height:70px; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); }

.nameBox	 { position:absolute; bottom:0; left:0; width:100%; height:auto; margin:0; padding:10px 0 !important; overflow:hidden; display:block; z-index:30; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
ul#sel_name { position:relative; float:left; width:auto; height:40px; margin:0 !important; padding:0; display:inline-block; background:#FFF; }
ul#sel_name li { position:relative; float:left; width:auto; height:40px; margin:0; padding:0 20px; text-align:center; font-family: 'NanumGothic', 'Sans-serif'; color:#444; font-size:18px; line-height:40px; font-weight:500; display:block; border-left:1px solid #999;  }
ul#sel_name li span { color:#000;  }
ul#sel_name li:first-child { border-left:0;  }
button#snapshot { position:relative; float:right; width:auto; height:40px; margin:0; padding:0 20px; font-family: 'NanumGothic', 'Sans-serif'; color:#FFF; font-size:16px; line-height:40px; font-weight:500; display:inline-block; background:#e8346f; border:none; border-radius:5px !important; }
button#snapshot:hover { background:#d8245f; }
button#snapshot i { padding:0 5px 0 0; }

#vm_con { position:relative;clear:both; float:left; width:100%; height:auto; margin:0; padding:0; display:table; z-index:80; background:#FFF; }
#sly_door, #sly_post { width:calc(40% - 30px); }
#vm_con ul.vm_items { position:relative; clear:both; float:none; width:100%; height:auto; margin:0; padding:0 5px 0 10px; display:table; }
#vm_con ul.vm_items li { position:relative; float:left; width:60px; height:60px; margin:0; padding:5px; cursor:pointer; display:block; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#vm_con ul.vm_items li:first-child { }
#vm_con ul.vm_items li .section-img { position:relative; clear:both; width:50px; height:50px; margin:0; padding:0; display:block; border-radius:25px !important; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#vm_con ul.vm_items li .section-img .section-inner { position:relative; clear:both; width:50px; height:50px; margin:0; padding:0; display:block; background-repeat:no-repeat; background-position:center center; background-size:50px 50px; border:none; border-radius:25px !important; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#vm_con ul.vm_items li .section-txt { position:relative; clear:both; width:100%; height:25px; margin:0; padding:0; text-align:center; color:#888; font-size:12px; line-height:25px; font-weight:400; display:none; }
#vm_con ul.vm_items li.selected .section-img { border:1px solid #4e94df;  }
#vm_con ul.vm_items li.selected .section-img .section-inner { width:48px; height:48px; border:3px solid #FFF;  }
#vm_con ul.vm_items li.selected .section-txt { color:#0061af; font-weight:600; }

#sly_point.sly_box { width:20%; height:auto; }
#vm_con ul.vm_items2 { position:relative; clear:both; float:none; width:100%; height:35px; margin:0; padding:0 10px; display:table; }
#vm_con ul.vm_items2 li { position:relative; float:left; width:100%; height:35px; margin:5px 0; padding:0 2px; cursor:pointer; display:inline-block; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#vm_con ul.vm_items2 li .section-txt { position:relative; float:left; width:100%; height:35px; margin:0; padding:0; text-align:center; color:#444; font-size:12px; line-height:35px; font-weight:400; display:block; background:#FFF; border:1px solid #777; border-radius:5px !important; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#vm_con ul.vm_items2 li.selected .section-txt { color:#FFF; background:#4e94df; border-color:#4e94df; }
#point_comment { position:relative; clear:both; float:left; width:100%; height:35px; margin:0; padding:0; display:block; text-align:center; color:#777; font-size:12px; line-height:25px; font-weight:400; }

.tapGroup { position:relative; clear:both; float:none; width:100%; height:auro; margin:0; padding:5px 0 0 0; display:table; border-bottom:1px solid #99c2eb; }
.tapGroup .tapTitle { position:relative; clear:both; float:none; width:310px; height:40px; margin:0 5px; padding:10px; text-align:left; cursor:pointer; color:#FFF; font-size:16px; line-height:20px; font-weight:400; display:block; }
.tapGroup .tapTitle:before { content: "-"; margin-right:8px; display:inline; }
.tapGroup.close .tapTitle:before { content: "+"; }
.tapGroup.close ul.vm_items3 { height:0 !important; display:block; }

ul.vm_items3 { position:relative; clear:both; float:none; width:320px; height:auto; margin:0; margin-bottom:5px; padding:0 10px; overflow:hidden; display:table; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear; }
ul.vm_items3 li { position:relative; float:left; width:75px; height:75px; margin:0; padding:5px; cursor:pointer; display:block; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
ul.vm_items3 li .section-img { position:relative; float:left; width:65px; height:65px; margin:0; padding:0; display:block; background-repeat:no-repeat; background-position:center center; background-size:cover; border:1px solid #99c2eb; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
ul.vm_items3 li.selected .section-img { border:3px solid #FFF;  }

ul#sceneList { position:relative; clear:both; float:left; width:100%; height:auto; margin:0; padding:0; display:table; }
ul#sceneList li { position:relative; clear:both; float:left; width:100%; height:auto; margin:0; padding:0; display:table; background:#666; }
ul#sceneList li .backImg { position:relative; float:left; width:320px; height:200px; margin:0; padding:0; display:block; background-repeat:no-repeat; background-position:center center; background-size:320px 240px; border:0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; }
ul#sceneList li .backGrd { position:absolute; top:0; left:0; width:100%; height:100%; margin:0; padding:0; display:block; opacity:0.5; border-top:1px solid #FFF; background-repeat:no-repeat; background-position:center center; background-size:100% 100%; background-image: url('http://ep001.cafe24.com/theme/eb4_basic/image/viewmix/scene_gradient.png'); z-index:2; }
ul#sceneList li:first-child .backGrd { border:0; }
ul#sceneList li .goScene { position:absolute; top:50%; left:50%; width:auto; height:0; margin:0; padding:0 15px; cursor:pointer; overflow:hidden; opacity:0; text-align:center; color:#FFF; font-size:16px; line-height:25px; font-weight:500; letter-spacing:0.1em; display:inline-block; background:#000; border-radius:5px; z-index:3; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); }
ul#sceneList li.selected .backImg { height:240px; background-size:336px 252px; }
ul#sceneList li.selected .backGrd { opacity:0; }
ul#sceneList li.selected .goScene { height:auto; padding:10px 15px; opacity:1; }

.divider { position:relative; clear:both; float:none; width:100%; height:5px; margin:20px 0; padding:0; display:block; background:#000; }

@media (max-width:991px) {
	#Screen { width:100%; margin:10px 0; padding:0 15px; }
	ul#sel_name { height:30px; }
	ul#sel_name::before { left:-53px; width:53px; height:30px; background-size:53px 30px; }
	ul#sel_name::after { right:-53px; width:53px; height:30px; background-size:53px 30px; }
	ul#sel_name li { height:20px; padding:0 15px; font-size:16px; line-height:20px; }
	.sly_box { margin:10px 0 0; padding:30px 0 0; display:block; border:none; }
	button#snapshot { height:30px; padding:0 20px; font-size:14px; line-height:30px; }
	.optionTitle { top:0; left:0; width:100%; }
	.optionTitle::before { content: ""; position:absolute; top:50%; left:0; width:100%; height:1px; margin:0; padding:0; overflow:hidden; display:block; background:#DDD; }
	#sly_door, #sly_post { width:100%; }
	#vm_con ul.vm_items { height:70px; padding:0 10px; }
	#vm_con ul.vm_items li { width:46px; height:46px; padding:3px; }
	#vm_con ul.vm_items li .section-img { width:40px; height:40px; border-radius:20px !important; }
	#vm_con ul.vm_items li .section-img .section-inner { width:40px; height:40px; background-size:40px 40px; border-radius:20px !important; }
	#vm_con ul.vm_items li.selected .section-img .section-inner { width:38px; height:38px;  }

	#sly_point.sly_box { width:100%; height:60px; }
	#vm_con ul.vm_items2 { padding:0 10px; display:block; }
	#vm_con ul.vm_items2 li { width:16.66%; }

}
@media (max-width:767px) {
	#Screen { width:100%; margin:10px 0; padding:0 15px; }
	#Screen .scrInner { border-radius:5px !important; }
	ul#vmc_screen:before { padding-top:75%; }
	ul#sel_name { height:25px; }
	ul#sel_name::before { left:-40px; width:40px; height:25px; background-size:40px 25px; }
	ul#sel_name::after { right:-40px; width:40px; height:25px; background-size:40px 25px; }
	ul#sel_name li { height:15px; padding:0 8px; font-size:13px; line-height:15px; }
	button#snapshot { height:25px; padding:0 15px; font-size:12px; line-height:25px; }
	.sly_box { margin:0; padding:25px 0 10px !important; display:block; border:none; }
	.optionTitle { left:0; }

}