@import url('../../../../oxjs/addon.css');

.app_wrap {margin:10px 0;}
.app_wrap>.func {text-align:right;}
.app_wrap>.func .btn_a {margin:10px 0;}

.app_head {margin:10px 0;}
.app_head:after {display:block; clear:both; content:'';}
.app_head .cate {float:left; white-space:nowrap;}
.app_head .tot {float:right; white-space:nowrap;}

.ox_tbl_list th.chk {width:1.75em;}
.ox_tbl_list th.num {width:3.75em;}
.ox_tbl_list td.num {white-space:nowrap;}
.ox_tbl_list td.tit {text-align:left;}
.ox_tbl_list th.stt {width:4.5em;}
.ox_tbl_list th.stt_lb {width:9em;}
.ox_tbl_list th.att {width:4.5em;}
.ox_tbl_list th.dt {width:7.5em;}
.ox_tbl_list th.nm {width:7.5em;}
.ox_tbl_list th.my {width:5em;}
.ox_tbl_list th.set,
.ox_tbl_list th.edt,
.ox_tbl_list th.del,
.ox_tbl_list th.ok {width:3em;}
.ox_tbl_list th.proc {width:5em;}
.ox_tbl_list th.edit {width:22px; font-size:10px; letter-spacing:-10px; color:#F6F6F6;}

.ox_tbl_view .i_reg {margin-right:2%; white-space:nowrap;}
.ox_tbl_view .i_reg .lb {font-size:0.9375em; color:#888;}
.ox_tbl_view .i_reg .lb:after {content:'\0020\003A';}

.url_copy {margin:10px 0; font-size:11px; color:#888; text-align:right;}
.url_copy b {display:inline-block; padding:0 5px; border-radius:3px; background:#999; font-weight:normal; color:#FFF; vertical-align:middle; cursor:pointer;}
.url_copy b+span {font-family:Tahoma,Sans-serif;}

.app_guest {margin-top:30px; padding:3% 3% 3% 2%; background:#F6F6F6; text-align:left;}
.app_guest .item {display:inline-block; margin-left:2%; vertical-align:middle;}
.app_guest .item+.item {white-space:nowrap;}

.app_attach:empty {display:none;}
.app_attach .item:first-child {margin-top:8px;}
.app_attach .dt {margin:0 4px; font-size:0.875em; color:#888;}

.app_tool {margin:30px 0 10px;}
.app_tool .handle {display:inline-block; width:8px; height:16px; margin-right:4px; border:2px solid #999; border-right:0; border-left:0; vertical-align:middle; cursor:move;}
.app_tool .handle:before {float:left; width:8px; height:4px; margin:4px 0; border:2px solid #999; border-right:0; border-left:0; content:'';}
.app_tool>.btn, .app_tool .more {display:none;}
.app_tool.floating .tool {padding:15px 20px 15px 15px; border:1px solid #888; border-radius:5px; background:#FFF; box-shadow:0 0 9px rgba(0,0,0,0.3); text-align:left; white-space:nowrap;}
.app_tool.floating>.btn {display:inline-block;}
.app_tool.floating .more {display:block; margin-top:15px; padding-top:15px; border-top:1px dashed #DDD; text-align:center;}

.app_setting {margin:10px 0; text-align:left;}
.app_setting .row {margin:5px 0; line-height:2;}
.app_setting .lb {float:left; overflow:hidden; width:5em; margin-right:-5em; color:#888; text-overflow:ellipsis; white-space:nowrap;}
.app_setting .rr {display:block; margin-left:5em;}
.app_setting .rr .br {display:block; margin:0;}
.app_setting input[type="text"], .app_setting textarea {margin:0;}
.app_setting .unfold, .app_setting .fold {display:block; overflow:hidden; width:90%; height:18px; margin:10px auto; padding:0; border:1px solid transparent; border-radius:9px; background:none; font-size:12px; line-height:16px; text-align:center; transition:all 0.3s;}
.app_setting .unfold:hover, .app_setting .fold:hover {border:1px solid #999; background:#FFF; box-shadow:0 -5px 9px rgba(0,0,0,0.1) inset;}
.app_setting .unfold:before, .app_setting .fold:before {float:left; width:100%; content:'\25BC';}
.app_setting .fold:before {content:'\25B2';}

.app_item_bg1, .app_item_bg2 {position:relative;}
.app_item_bg1:before, .app_item_bg2:before {position:absolute; top:-1px; right:0; bottom:0; left:0; width:2px; margin:0 auto; background:#000; content:'';}
.app_item_bg2:before {bottom:50%;}
.app_item_dnode, .app_item_inode, .app_item_pnode {position:absolute; top:0; right:0; bottom:0; left:0; overflow:hidden; width:18px; height:18px; margin:auto; border:2px solid #000; border-radius:50%; background:#FFF; text-indent:-199px;}
.app_item_dnode, .app_item_inode {background:#000;}
.app_item_dnode:before, .app_item_inode:before, .app_item_inode:after {position:absolute; top:0; right:0; bottom:0; left:0; width:12px; height:2px; margin:auto; background:#FFF; content:'';}
.app_item_inode:after {width:2px; height:12px;}
.app_item_snode {position:absolute; top:0; bottom:0; left:50%; overflow:hidden; width:12px; height:2px; margin:auto -1px; background:#000;}

.app_box {overflow:auto; margin:30px 0; border:1px solid #DDD;}
.app_box .tit {padding:8px 12px; border-top:1px solid #DDD; border-bottom:1px solid #DDD; background:#F6F6F6;}
.app_box .tit:first-child {border-top:0;}
.app_box table {width:100%; border:0;}
.app_box caption, .app_box thead {display:none;}
.app_box th, .app_box td {padding:0; border:0;}
.app_box tr:hover td {background-color:#EEE;}
.app_box td.node {position:relative; width:50px;}
.app_box td.node:before {position:absolute; top:0; right:0; bottom:0; left:0; width:1px; margin:0 auto; background:#000; content:'';}
.app_box td.var {width:6em; padding-left:30px; white-space:nowrap;}
.app_box td.var:last-child {padding-right:30px;}
.app_box .app_item_dnode, .app_box .app_item_inode, .app_box .app_item_pnode {width:11px; height:11px; border-width:1px;}
.app_box .app_item_dnode:before, .app_box .app_item_inode:before {width:7px; height:1px;}
.app_box .app_item_inode:after {width:1px; height:7px;}
.app_box .app_item_snode {width:6px; height:1px; margin-left:0;}

.srch_normal .date {margin:10px 0;}
.date_toggle {display:inline-block; position:relative; height:2em; font-size:0.75em; vertical-align:middle; white-space:nowrap;}
.date_toggle input {position:absolute; top:0; right:0; bottom:0; left:0; width:5px; height:5px; margin:auto; padding:0; border:0;}
.date_toggle label {float:left; position:relative; margin:-1px 0; padding:0 8px; border:1px solid #777; border-radius:1em; background:#FFF; line-height:2em; cursor:pointer;}
.date_toggle label:before {margin-right:3px; color:#555; content:'\25BC';}
.date_toggle.on label {box-shadow:0 2px 4px rgba(0,0,0,0.2) inset;}
.date_toggle.on label:before {content:'\25B2';}

.app_set_tit label {float:left; overflow:hidden; width:5em; margin-right:-5em; color:#888; text-overflow:ellipsis; white-space:nowrap;}
.app_set_tit .set_lst {display:block; margin-left:5em;}
.app_set_tit .set_lst select {width:90%; margin:0;}
.app_set_tit .set_btns {clear:both; margin:5px 0 15px 5em;}

.app_preview {position:absolute; width:500px; padding:8px 1em; border:1px solid #888; border-radius:5px; background:#FFF; box-shadow:0 0 9px rgba(0,0,0,0.3); z-index:9999;}
.app_preview .file {margin-top:8px; padding-top:8px; border-top:1px solid #DDD;}

.ico_state1, .ico_state2, .ico_state3 {display:inline-block; min-width:3.8em; height:1.8em; padding:0 0.4em; background:#999; font-size:0.9375em; color:#FFF; line-height:1.8em; text-align:center; vertical-align:middle; white-space:nowrap;}
.ico_state1 {background:#8B4;}
.ico_state2 {background:#3BE;}

.inp_text, .inp_textarea, .inp_select, .inp_file {}
.inp_radio, .inp_check {}
.inp_iden {ime-mode:disabled;}

.bx_pw_off span, .bx_pw_on span {display:inline-block; overflow:hidden; height:22px; padding:0 10px; border-radius:11px; background:#333; line-height:99px; vertical-align:middle; white-space:nowrap;}
.bx_pw_on span {background:#E5E5E5; color:#000; line-height:22px;}
.bx_pw_off button, .bx_pw_on button {display:inline-block; overflow:hidden; width:22px; height:22px; margin:0; padding:0; border:0; background:none; vertical-align:middle;}
.bx_pw_off button:before, .bx_pw_on button:before {float:left; width:22px; height:22px; background:url(../../../../templates/application/default/__magicdir__/image/ico_lock.png) no-repeat 50% 50%/18px 18px; content:'';}
.bx_pw_on button:before {background-image:url(../../../../templates/application/default/__magicdir__/image/ico_unlock.png);}

.btn_ok {display:inline-block; position:relative; overflow:hidden; width:22px; height:22px; margin:0; padding:0; border:0; border-radius:0; background:none; line-height:999px; vertical-align:middle; -webkit-appearance:none;}
.btn_ok:before {position:absolute; top:4px; left:7px; width:7px; height:7px; border:3px solid #3AC; border-top:0; border-left:0; content:'';}
.btn_ok:after {position:absolute; top:8px; left:4px; width:0; height:1px; border:4px solid transparent; border-right:5px solid #3AC; border-left:0; content:'';}

.app_note {}
.app_note img {max-width:100%; height:auto;}
.app_note .preview {text-align:center;}
.app_note .preview+.preview {margin-top:10px;}
