
/* index.html */

.index h1 {text-align:center; margin-top:100px;}
.index p.index_txt {text-align:center; color:#9299A2; line-height:140px; font-size:38px; font-weight:normal; letter-spacing:3px; word-spacing:2px; font-weight:200; }

.index .login_wrap {width:524px; margin:0 auto 14px; background:#F2F2F2; padding:30px 0;}

.index .login_wrap .lang_wrap {width:280px; height:34px; line-height:34px; margin:10px auto; padding:0; font-size:16px; } 

.index .login_wrap .lang_wrap label {padding:0 12px;}
.index .login_wrap .lang_wrap select {width:176px; height:34px; padding:4px; margin-left:2px;}

.index .login_wrap input[type="text"]  {display:block; width:280px; height:34px; line-height:34px; margin:10px auto; padding:0; text-indent:10px; border:1px solid #CFCFCF; font-size:16px; color:#CFCFCF; border-radius:2px;}
.index .login_wrap input[type="password"]  {display:block; width:280px; height:34px; line-height:34px; margin:10px auto; padding:0; text-indent:10px; border:1px solid #CFCFCF; font-size:16px; color:#CFCFCF; border-radius:2px;}
.index #login_btn {display:block; width:280px; height:34px; text-align:center; font-size:16px; font-weight:bold; color:#fff; border:0 none; background:#197DC2; cursor:pointer; margin:20px auto; border-radius:2px;}

.index .login_wrap .login_util {width:280px; margin:0 auto; color:#95989A;}
.index .login_wrap .login_util input[type="checkbox"] { }
.index .login_wrap .login_util p {display:inline-block; float:right;}
.index .login_wrap .login_util p input[type="button"] {border:0 none; background:none; cursor:pointer; color:#95989A;}

.index p.index_copy {text-align:center; color:#C2C2C2; line-height:16px; font-size:8px;}

/* index.html_End */




/* video_live.html */

/* 영상보기_왼쪽_My Group */
aside.sub_menu_wrap { clear: both; position:relative; float:left; width:300px; min-height:740px; padding-left:100px; background:#fff; overflow-y:auto;}
aside h2 {color:#197DC2; font-size:22px; padding:36px 24px;}

#mic_mode {position:absolute; right:26px; top:28px; display:block; width:50px; height:50px;}
#mic_mode:hover {background:url('../../img/mic_over_bg.png') no-repeat 0px 0px;}

.mic_on {display:;}
.mic_off {display:none;}


/* 영상보기_왼쪽메뉴_Group */
aside dl.group {clear:both; position:relative; padding-left:20px; margin-bottom:30px;}
aside dl.group dt {font-size:20px; font-weight:bold; padding-left:20px; background:url('../../img/gt_arrow.png') no-repeat 0px 6px; cursor:pointer;}
aside dl.group dt.group_title {text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; width: 130px;}
aside dl.group dt.arr_bot {background:url('../../img/gt_arrow.png') no-repeat 0px -14px;}
aside dl.group dd.helmet_list {clear:both; position:relative; padding:0 34px 0 22px; font-size:16px; margin-top:14px; height:20px; }
aside dl.group dd.helmet_list p {float:left; padding-top:3px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; width: 160px;}
aside dl.group dd.helmet_list .set_btn {float:right; padding-top:3px; cursor:pointer;}
aside dl.group dd.helmet_list .set_tbl {position:absolute; right:10px; top:26px; text-align:center; font-size:13px; background:#fff; width:260px; z-index:99; display:none; table-layout:fixed; }
aside dl.group dd.helmet_list .set_tbl th {clear:both; background:#313942; border:1px solid #313942; color:#fff; text-align:left; padding:4px 4px 4px 14px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; }
aside dl.group dd.helmet_list .set_tbl th .set_tbl_close {float:right; cursor:pointer; }
aside dl.group dd.helmet_list .set_tbl td {border:1px solid #313942; padding:4px 14px; }
aside dl.group dd.helmet_list .set_tbl td .vol_num {padding:4px 18px; }

aside dl.group dd.audio_select {position:absolute; right:14px; top:0px; font-size:12px; }

aside dl.group input[type="checkbox"] {float:right; margin:5px; }
aside dl.group input.audio_chk_grp {float:none;}


/* 툴팁 */
[data-tooltip-text]:hover {
	position: relative;
}

[data-tooltip-text]:hover:after {
	background-color: #000000;
	background-color: rgba(0, 0, 0, 0.8);

	-webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	-moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

	color: #FFFFFF;
	font-size: 1em;
	content: attr(data-tooltip-text);

  /* margin-top: 10px; */
  /* margin-bottom: 10px; */
	left: 0;    
	padding: 7px 12px;
	position: absolute;
	width: auto;
	min-width: 50px;
	max-width: 150px;
	word-wrap: break-word;

	z-index: 9999;
}

/* 영상보기 */
#cam_wrap {float:left; padding-left:20px; min-width:800px; }

#cam_wrap .cam_menu {padding:24px 0 10px; } 
#cam_wrap .cam_menu li {display:inline-block; font-size:16px; line-height:28px; margin-right:30px; } 
#cam_wrap .cam_menu p {display:inline-block; color:#fff; margin-right:10px; opacity:0.8; } 
#cam_wrap .cam_menu select {padding:0 4px; margin-top:-4px; font-size:14px; }
#cam_wrap .cam_menu li a {display:block; width:110px; height:28px; color:#fff;} 
#cam_wrap .cam_menu li a:hover {color:#ffe353;} 

#cam_wrap .cam_menu .cam_refresh {background:url('../../img/ico_refresh.png') no-repeat 70px -2px; margin-left:10px;} 
#cam_wrap .cam_menu .cam_newwin {background:url('../../img/ico_newwin.png') no-repeat 70px 2px;} 

#cam_wrap #slice_wrap {clear:both; position:relative; box-sizing:border-box; }
#cam_wrap #slice_wrap ul {position:absolute; left:0px; top:0px; width:100%; }
#cam_wrap #slice_wrap ul li {float:left; background:#fff; margin:1px; box-sizing:border-box; }
#cam_wrap #slice_wrap ul li h5 {height:30px; background:#313942 url('../../img/ico_video_off.png') no-repeat 12px 11px; box-sizing:border-box; overflow:hidden; }
#cam_wrap #slice_wrap ul li h5 span.cam_title  {float:left; padding:0 0 0 46px; line-height:30px; font-size:12px; color:#FFFFFF; opacity:0.6;}
/* #cam_wrap #slice_wrap ul li h5 span.cam_title_on  {float:left; padding:0 0 0 46px; line-height:24px; font-size:12px; color:#fff; opacity:1;} */
#cam_wrap #slice_wrap ul li h5 span {float:right; padding:3px 4px 0 0;}
#cam_wrap #slice_wrap ul li h5 span.cam_resolution {display: none; height:30px; line-height:30px; }
#cam_wrap #slice_wrap ul li h5 span.cam_resolution select {width:60px; height:22px; top:0px; font-size:14px; margin-top:-7px; margin-right:3px; background-color:#313942; color:#FFFFFF; }
/* #cam_wrap #slice_wrap ul li h5 span.cam_signal {display:inline-block; width:24px; height:30px; line-height:30px; background:url('../../img/ico_signal_1.png') no-repeat 0px 7px;}  */
#cam_wrap #slice_wrap ul li h5 span.cam_signal {display:inline-block; width:24px; height:30px; line-height:30px; } 
/* #cam_wrap #slice_wrap ul li h5 span.cam_battery {display:inline-block; width:30px; height:30px; line-height:30px; background:url('../../img/ico_battery_1.png') no-repeat 0px 7px;} */
#cam_wrap #slice_wrap ul li h5 span.cam_battery {display:inline-block; width:30px; height:30px; line-height:30px; }
#cam_wrap #slice_wrap ul li h5 span.cam_close {display:inline-block; cursor:pointer; width:21px; line-height:30px; height:30px; background:url('../../img/cam_close.png') no-repeat 0px 5px;}

#cam_wrap #slice_wrap ul li .video {background-color: #000000; width:100%; text-align:center; overflow:hidden; padding-top:3px; border-bottom:3px solid #000000; }
#cam_wrap #slice_wrap ul li .video p {text-align:center; color:#ffffff; }

/* 타이틀바 height 24px 일때 */
/* 
#cam_wrap #slice_wrap ul#slice_1 > li {width:100%;} 
#cam_wrap #slice_wrap ul#slice_1 > li .video p {font-size:2.5em;} 
#cam_wrap #slice_wrap ul#slice_4 > li {width:48%;} 
#cam_wrap #slice_wrap ul#slice_4 > li .video p {font-size:1.8em;} 
#cam_wrap #slice_wrap ul#slice_9 > li {width:30.7%;}  
#cam_wrap #slice_wrap ul#slice_9 > li .video p {font-size:1.3em;} 
 */

 /* 타이틀바 height 30px 일때 */
#cam_wrap #slice_wrap ul#slice_1 > li {width:99.2%;} 
#cam_wrap #slice_wrap ul#slice_1 > li .video p {font-size:2.5em;} 
#cam_wrap #slice_wrap ul#slice_4 > li {width:47.1%;} 
#cam_wrap #slice_wrap ul#slice_4 > li .video p {font-size:1.8em;} 
#cam_wrap #slice_wrap ul#slice_9 > li {width:29.7%;}  
#cam_wrap #slice_wrap ul#slice_9 > li .video p {font-size:1.3em;} 

/* video_live.html_End */


/* 팝업 레이어 */
.Pstyle {display:none; position:relative; width:auto; padding:20px; background:#fff; opacity:0; box-shadow:2px 2px 10px rgba(0,0,0,0.4); z-index:99; }

.Pstyle h4 {padding-bottom:10px; font-size:20px; font-weight:bold; line-height:32px; line-height:32px; color:#313942;} 

	#popup_id h4 {background:url('../../img/bg_bar_tit.png') no-repeat 0px 0px; text-indent:22px; border-bottom:1px solid #D3D7DB; }
	#popup_pw h4 {background:url('../../img/bg_bar_tit.png') no-repeat 0px 0px; text-indent:22px; border-bottom:1px solid #D3D7DB; }
	
	#popup_grp h4 {background:url('../../img/ico_add_group.png') no-repeat 0px 2px; text-indent:42px;}
	#popup_hlm h4 {background:url('../../img/ico_add_equip.png') no-repeat 0px 2px; text-indent:50px;}
	#popup_user h4 {background:url('../../img/ico_add_user.png') no-repeat 0px 2px; text-indent:34px;}

	#modify_grp h4 {background:url('../../img/ico_add_group.png') no-repeat 0px 2px; text-indent:42px;}
	#modify_hlm h4 {background:url('../../img/ico_add_equip.png') no-repeat 0px 2px; text-indent:50px;}
	#modify_user h4 {background:url('../../img/ico_add_user.png') no-repeat 0px 2px; text-indent:34px;}

.Pstyle ul {margin:30px 0 60px 0; padding:0 30px 30px 20px; font-size:15px; }
.Pstyle ul li {background:url('../../img/bg_bar.png') no-repeat 0px 5px; text-indent:10px; line-height:34px;}
.Pstyle ul li span {display:inline-block; width:100px; }
.Pstyle ul li input[type="text"] {width:190px; }
.Pstyle ul li:last-child input[type="text"] {width:100px; background:#EEEEEE; }
.Pstyle ul li:last-child input[type="button"] {background:#9299A2; border:0 none; font-size:12px; color:#fff; padding:4px 5px; }
	
.Pstyle table {font-size:14px; line-height:28px; text-align:left; padding-bottom:30px; margin-bottom:60px;}
.Pstyle table tr:first-child th {border-top:1px solid #eee;}
.Pstyle table tr:first-child td {border-top:1px solid #eee;}
.Pstyle table th {width:100px; color:#5FB6BA; padding:4px 0 4px 10px; border-bottom:1px solid #eee; text-align:left;}
.Pstyle table th span {float:right;}
.Pstyle table td {padding:4px 10px 4px 20px; border-bottom:1px solid #eee;}

	.over_chk_btn {background:#5FB6BA; color:#fff; border:0 none; border-radius:2px; font-size:12px; padding:2px 4px;}
	.over_chk_true {background:#5FB6BA; color:#fff; border:0 none; border-radius:2px; font-size:12px; padding:2px 4px;}
	.over_chk_false {background:#DB0000; color:#fff; border:0 none; border-radius:2px; font-size:12px; padding:2px 4px;}


.Pstyle .pop_btn {position:absolute; bottom:0px; left:0px; width:100%; }
.Pstyle .pop_btn input {display:block; float:left; width:50%; height:60px; line-height:60px; background:#00579A; border:0 none; font-size:16px; font-weight:bold; color:#fff; cursor:pointer;}
.Pstyle .pop_btn .cancel_btn {display:block; float:right; width:50%; height:60px; line-height:60px; background:#eee; border:0 none; font-size:16px; font-weight:bold; color:#696A6B; text-align:center; cursor:pointer;}

.Pstyle .pop_btn input:hover {background:#268EDE; transition:all 0.1s ease-in-out;} 
.Pstyle .pop_btn .cancel_btn:hover {background:#c2c2c2; transition:all 0.1s ease-in-out;} 


.Pstyle .popclose_btn {position:absolute; top:14px; right:14px; cursor:pointer;}

.Pstyle select {font-size:12px; padding-right:10px;}


