@charset "UTF-8";
/*!
	颜色函数
	liuyouji
	2019-03-24
	2020-12-10
	2022-05-04
*/
/*! 滚动条 */ /*
	自定义表格
*/
.l-tbl {
  display: table;
  border-collapse: collapse;
  margin: 5px auto;
}
.l-tbl > div {
  display: table-row;
}
.l-tbl > div.th { /*! table head row */
  text-align: center;
  font-weight: normal;
}
.l-tbl > div > div, .l-tbl > div > span {
  display: table-cell;
  vertical-align: middle;
}

body {
  overflow-y: scroll;
}

/*! 滚动条的定义 */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  /*&-track-piece {
  	background: transparentize(lighten($thumb,40),0.10);
  	border-radius: $bdrs;
  }*/
}
::-webkit-scrollbar:vertical {
  background: transparent;
}
::-webkit-scrollbar:horizontal {
  background: transparent;
}
::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1666666667);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-button {
  background: rgba(85, 170, 255, 0.4666666667);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover, ::-webkit-scrollbar-button:hover {
  background: rgba(0, 119, 238, 0.4666666667);
}
::-webkit-scrollbar-button {
  height: 20px;
  width: 20px;
}
::-webkit-scrollbar-corner {
  background: transparent;
}

::-webkit-resizer {
  background: #f00;
}

.l-ftp {
  margin: 5px auto;
  width: 800px;
  color: #7b7b7b;
}
.l-ftp a {
  text-decoration: none;
}
.l-ftp .head {
  line-height: 34px;
  margin: 5px 0;
  text-align: center;
  background-color: #09f;
  background: #09f linear-gradient(180deg, #4db8ff, #09f) repeat-x;
  border-radius: 5px;
  color: #fff;
  padding: 3px;
}
.l-ftp .links {
  line-height: 34px;
  margin: 5px 0;
}
.l-ftp .paths:before {
  content: "路径: ";
}
.l-ftp .paths > a {
  display: inline-block;
  margin: 0 1px;
  padding: 0 6px;
  border-radius: 3px;
  background-color: #ff851a;
  background: #ff851a linear-gradient(180deg, #ffaa5f, #ff851a) repeat-x;
  color: #fff;
  vertical-align: middle;
}
.l-ftp .paths > a > span {
  max-width: 100px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.l-ftp .paths > a:nth-child(1) > span, .l-ftp .paths > a:last-child > span {
  max-width: 200px;
}
.l-ftp .paths > a:hover {
  background-color: #cc5f00;
  background: #cc5f00 linear-gradient(180deg, #db8f4d, #cc5f00) repeat-x;
}
.l-ftp .paths > a:after {
  content: "";
}
.l-ftp .filelist {
  margin: 5px auto;
  border-collapse: collapse;
  width: 100%;
  font-size: 14px;
}
.l-ftp .filelist > div:first-child > div.th:first-child {
  border-radius: 5px 0 0 0;
}
.l-ftp .filelist > div:first-child > div.th:last-child {
  border-radius: 0 5px 0 0;
}
.l-ftp .filelist > div:last-child {
  border-radius: 0 0 5px 5px;
}
.l-ftp .filelist > div:last-child > div:first-child {
  border-radius: 0 0 0 5px;
}
.l-ftp .filelist > div:last-child > div:last-child {
  border-radius: 0 0 5px 0;
}
.l-ftp .filelist > div > div.th {
  line-height: 34px;
  height: 34px;
  background-color: #66c2ff;
  background: #66c2ff linear-gradient(180deg, #94d4ff, #66c2ff) repeat-x;
  color: #fff;
  border-right: solid 1px #fff;
  /* sort */
}
.l-ftp .filelist > div > div.th:last-child {
  border: none;
}
.l-ftp .filelist > div > div.th:hover {
  background-color: #33adff;
  background: #33adff linear-gradient(180deg, #70c6ff, #33adff) repeat-x;
}
.l-ftp .filelist > div > div {
  line-height: 34px;
  height: 34px;
  padding: 0px 5px;
  border-right: solid 1px #fff;
}
.l-ftp .filelist > div > div:last-child {
  border: none;
}
.l-ftp .filelist > div > div > div {
  /* 播放器启动按钮 */
  position: relative;
}
.l-ftp .filelist > div > div > div > a {
  cursor: pointer;
  display: block;
  padding-left: 24px;
  background-position: 2px center;
  background-repeat: no-repeat;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #e66b00;
}
.l-ftp .filelist > div > div > div > a:hover {
  color: #994700;
}
.l-ftp .filelist > div > div > div > .ctrls {
  display: none;
  position: absolute;
  right: 3px;
  top: 0px;
  height: 34px;
}
.l-ftp .filelist > div > div > div > .ctrls > span {
  background: rgba(0, 153, 255, 0.5);
  color: #cc5f00;
  border-radius: 5px;
  padding: 5px 5px;
  margin-left: 5px;
  cursor: pointer;
}
.l-ftp .filelist > div > div > div > .ctrls > span.disabled {
  filter: grayscale(0.8);
  pointer-events: none;
}
.l-ftp .filelist > div > div > div > .ctrls > span:hover {
  background: rgba(0, 153, 255, 0.9);
  color: #fff1e6;
}
.l-ftp .filelist > div > div > div:hover > .ctrls {
  display: block;
}
.l-ftp .filelist > div > div:nth-child(1) {
  width: 450px;
}
.l-ftp .filelist > div > div:nth-child(1) > div {
  width: 450px;
}
.l-ftp .filelist > div > div:nth-child(2) {
  width: 80px;
  max-width: 80px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.l-ftp .filelist > div > div:nth-child(3) {
  text-align: right;
  width: 90px;
}
.l-ftp .filelist > div > div:nth-child(4) {
  text-align: center;
  width: 140px;
}
.l-ftp .filelist > div:nth-child(2n) {
  background-color: #f0f0f0;
}
.l-ftp .filelist > div:nth-child(2n+1) {
  background-color: #f7f7f7;
}
.l-ftp .filelist > div:hover {
  background-color: #ccebff;
  background: #ccebff linear-gradient(180deg, #dbf1ff, #ccebff) repeat-x;
}
.l-ftp .filelist > div:hover > div {
  /*border-color: l_lighten($clr1,0.2);*/
}
.l-ftp .filelist .file {
  background-image: url("file/file.png");
}
.l-ftp .filelist .bat {
  background-image: url("file/bat.png");
}
.l-ftp .filelist .bmp {
  background-image: url("file/bmp.png");
}
.l-ftp .filelist .del {
  background-image: url("file/del.png");
}
.l-ftp .filelist .doc {
  background-image: url("file/doc.png");
}
.l-ftp .filelist .doc0 {
  background-image: url("file/doc0.png");
}
.l-ftp .filelist .docx {
  background-image: url("file/docx.png");
}
.l-ftp .filelist .folder {
  background-image: url("file/folder.png");
}
.l-ftp .filelist .gif {
  background-image: url("file/gif.png");
}
.l-ftp .filelist .img {
  background-image: url("file/img.png");
}
.l-ftp .filelist .js {
  background-image: url("file/js.png");
}
.l-ftp .filelist .mdb {
  background-image: url("file/mdb.png");
}
.l-ftp .filelist .mp3 {
  background-image: url("file/mp3.png");
}
.l-ftp .filelist .msi {
  background-image: url("file/msi.png");
}
.l-ftp .filelist .ppt {
  background-image: url("file/ppt.png");
}
.l-ftp .filelist .pptx {
  background-image: url("file/pptx.png");
}
.l-ftp .filelist .rar {
  background-image: url("file/rar.png");
}
.l-ftp .filelist .reg {
  background-image: url("file/reg.png");
}
.l-ftp .filelist .txt {
  background-image: url("file/txt.png");
}
.l-ftp .filelist .xls {
  background-image: url("file/xls.png");
}
.l-ftp .filelist .xls0 {
  background-image: url("file/xls0.png");
}
.l-ftp .filelist .xlsx {
  background-image: url("file/xlsx.png");
}
.l-ftp .filelist .zip {
  background-image: url("file/zip.png");
}
.l-ftp .filelist .pdf {
  background-image: url("file/pdf.png");
}
.l-ftp .filelist .m4a {
  background-image: url("file/mp3.png");
}

@media (max-width: 820px) {
  .l-ftp {
    margin: 5px 10px;
    width: auto;
  }
  .l-ftp .paths > a > span {
    display: none;
  }
  .l-ftp .paths > a:after {
    content: "..";
  }
  .l-ftp .paths > a:nth-child(1) > span, .l-ftp .paths > a:last-child > span {
    display: block;
    max-width: 120px;
  }
  .l-ftp .paths > a:nth-child(1):after, .l-ftp .paths > a:last-child:after {
    content: "";
  }
  .l-ftp .filelist {
    width: 100%;
  }
  .l-ftp .filelist > div:first-child > div.th:first-child {
    border-radius: 5px 5px 0 0;
  }
  .l-ftp .filelist > div:last-child {
    border-radius: 0 0 5px 5px;
  }
  .l-ftp .filelist > div:last-child > div:first-child {
    border-radius: 0 0 5px 5px;
  }
  .l-ftp .filelist > div > div.th {
    display: none;
  }
  .l-ftp .filelist > div > div.th:first-child {
    display: table-cell;
    border: none;
  }
  .l-ftp .filelist > div > div {
    display: none;
  }
  .l-ftp .filelist > div > div:first-child {
    width: auto;
    display: table-cell;
    border: none;
  }
  .l-ftp .filelist > div > div:first-child > div {
    width: 100%;
  }
  .l-ftp .filelist > div > div:first-child > div a {
    white-space: pre-line;
  }
}
.l-ftp .filelist > div > div.sort {
  cursor: pointer;
}
.l-ftp .filelist > div > div.sort:before {
  display: inline-block;
  width: 14px;
  content: "";
  text-align: center;
}
.l-ftp .filelist > div > div.sort.asc {
  background-color: #007acc;
  background: #007acc linear-gradient(180deg, #4da2db, #007acc) repeat-x;
}
.l-ftp .filelist > div > div.sort.asc:hover {
  background-color: #008ae6;
  background: #008ae6 linear-gradient(180deg, #4dadee, #008ae6) repeat-x;
}
.l-ftp .filelist > div > div.sort.asc:before {
  color: #b3e0ff;
  font-weight: bold;
  content: "↑";
}
.l-ftp .filelist > div > div.sort.desc {
  background-color: #005c99;
  background: #005c99 linear-gradient(180deg, #4d8db8, #005c99) repeat-x;
}
.l-ftp .filelist > div > div.sort.desc:hover {
  background-color: #006bb3;
  background: #006bb3 linear-gradient(180deg, #4d97ca, #006bb3) repeat-x;
}
.l-ftp .filelist > div > div.sort.desc:before {
  color: #ffd6b3;
  font-weight: bold;
  content: "↓";
}