@charset "utf-8";

/* 网页 */
html {
    height: 100%;
    -webkit-tap-highlight-color: transparent;
}

/* 主体 */
body.普通主体 {
    background-color: #ededed;
    font-family: system-ui, -apple-system, Helvetica Neue, sans-serif;
    height: 100%;
    margin: 0;
    -webkit-tap-highlight-color: transparent;
}

/* 主体 */
main.普通主要 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    color: rgb(0 0 0 / 90%);
}

/* 文章 */
article.普通文章 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow-y: auto;
    box-sizing: border-box;
    opacity: 0;
    z-index: 1;
    background-color: #ededed;
    transition: transform .2s;
}

/* 页眉 */
header.内边页眉 {
    padding: 40px;
}

/* 部分 */
section.内边部分 {
    padding-bottom: 20px;
}

/* 页脚 */
footer.内边页脚 {
    padding-top: 40px;
    padding-bottom: 48px;
    text-align: center;
}

/* 分区 */
.列表分区 {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: .8rem;
}

/* 链接 */
a.列表链接 { display: flex; align-items: center; position: relative; user-select: none; cursor: default; text-decoration: none; background: white; }
a.列表链接::before { content: ""; border-top: 0.1rem solid whitesmoke; position: absolute; left: 3.4rem; top: -0.1rem; right: 0; }
a.列表链接::after { content: ""; background: url(data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.454%206.58l1.06-1.06%205.78%205.779a.996.996%200%20010%201.413l-5.78%205.779-1.06-1.061%205.425-5.425-5.425-5.424z%22%20fill%3D%22%23B2B2B2%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E) no-repeat center / contain; width: 1rem; margin: 0 .8rem 0 .2rem; height: 1.3rem; flex-shrink: 0; }
a.列表链接:active { background: #ebebeb; }


/* 图片 */
img.列表图片 { width: 1.4rem; height: 1.4rem; object-fit: contain; padding: 1rem; }

/* 中标题 */
h4.列表标题 { font-weight: normal; color: black; white-space: nowrap; margin: 1rem 1rem 1rem 0; overflow: hidden; text-overflow: ellipsis; }

/* 段落 */
p.列表段落 { margin-left: auto; color: gray; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 按钮 */
button.绿色按钮 {
    border: none;
    outline: none;
    background: #07c160;
    color: white;
    padding: 6px 12px;
    font-size: 14px;
    border-radius: 6px;
}
button.绿色按钮:active {
    background: #1b8b50;
}
button.灰色按钮 {
    border: none;
    outline: none;
    background: rgb(0 0 0 / 5%);
    color: white;
    padding: 6px 12px;
    font-size: 14px;
    border-radius: 6px;
}
button.灰色按钮:active {
    background: rgb(0 0 0 / 20%);
}

/* 文本框 */
textarea.满屏文本框 {
    width: 100%;
    border: none;
    outline: none;
    resize: none;
    padding: 0;
    height: 80vh;
}

@media (max-width: 767.9px) {
    /* 链接 */
    a.列表链接 { width: 100% }
}

@media (min-width: 768px) {
    /* 主要 */
    main.大屏主要 { margin: 1%; }

    /* 链接 */
    a.列表链接 { width: 23%; margin: 1% }
}