.media img {
     width: 125px;
     height: 100px;
 }
 
 .banner {
     width: 100%;
     border-radius: 15px;
 }
 
 .dark-mode {
     background-color: black;
     color: white;
 }
 
div {
     box-sizing: border-box;
 }
 /* 回到顶部 */
 
 .return-top {
     position: fixed;
     bottom: 50px;
     right: 30px;
 }
 
 .return-top img {
     width: 40px;
     height: 40px;
 }
 /* 回到顶部结束 */
 /* 标签开始 */
 
 .text {
     width: 75%;
     margin: 0 auto;
     font-size: 30px;
     margin: 20px auto;
     font-family: 'KaiTi';
 }
 
 .text h1 {
     text-align: center;
     margin-bottom: 20px;
     position: relative;
 }
 
 .text ::after {
     content: " ";
     position: absolute;
     -bkit-border-radius: 50%;
     border-radius: 50%;
     background: #ff5d58 !important;
     width: 12px;
     height: 12px;
     -webkit-box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     top: 5px;
     right: 45px;
 }
 
 .editor {
     background: rgba(255, 255, 255, 0.68);
     margin: 0px auto;
     width: 75%;
     border: 2px solid rgba(255, 255, 255, 0.68);
     border-radius: 15px;
 }
 
 .editor-wrap {
     justify-content: center;
     margin: 20px auto;
     width: 100%;
     display: flex;
     flex-direction: row;
 }
 
 .editor-area {
     border-bottom: 200px;
     width: 60%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 /* 输入题目狂 */
 
 .editor input {
     border-bottom: 2px solid #343a40;
     outline: 0!important;
     border: none;
     display: block;
     width: 100%;
     padding: 1em 2em .4em .3em;
     opacity: .8;
     /* transition: .3s; */
     background: 0 0!important;
     height: 46px;
     padding: 10px 16px;
     font-size: 18px;
     line-height: 1.3333333;
     border-radius: 6px;
 }
 
 .editor button {
     margin: 10px auto;
 }
 /* 发布页面右侧 */
 
 .editor-right {
     margin-left: 20px;
     margin-right: 7%;
     float: right;
     border-bottom: 200px;
     width: 30%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 
 .editor-right-title1 h2,
 h3 {
     color: #26c73d;
     position: relative;
     margin-top: 10px;
     font-size: 20px;
     font-family: '微软雅黑';
     text-align: center;
 }
 
 .editor-right-title1 h2::after {
     content: " ";
     position: absolute;
     -bkit-border-radius: 50%;
     border-radius: 50%;
     background: #ff5d58 !important;
     width: 12px;
     height: 12px;
     -webkit-box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     top: 5px;
     right: 45px;
 }
 
 .editor-right-title1 p {
     margin-left: 30px;
     margin-bottom: 15px;
     margin-top: 15px;
 }
 
 select {
     border-radius: 15px;
     background-color: #ebf0f0;
     margin: 5px 25px;
     /* float: left; */
     width: 90%;
     height: 30px;
     border-color: transparent;
     /* background: var(--body-bg-color); */
     /* color: var(--main-color); */
     /* box-shadow: none; */
     /* transition: border-color ease-in-out .15s, background ease-in-out .15s, box-shadow ease-in-out .15s, opacity ease-in-out .3s; */
 }
 
 .editor-right-textarea {
     border-radius: 15px;
     background-color: #ebf0f0;
     margin: 5px 25px;
     float: left;
     width: 90%;
     height: 200px;
     border-color: transparent;
     /* background: var(--body-bg-color); */
     color: var(--main-color);
     box-shadow: none;
     transition: border-color ease-in-out .15s, background ease-in-out .15s, box-shadow ease-in-out .15s, opacity ease-in-out .3s;
 }
 
 .editor-right-button {
     display: flex;
     justify-content: center;
     width: 100%;
 }
 
 .editor-right button {
     margin: 10px 10px;
     font-family: '微软雅黑';
     font-size: 20px;
     width: 30%;
     height: 40px;
     border-radius: 5px;
 }
 /* 发布诗词 */
 
 .line-post {
     margin-top: 20px;
     margin: 20px auto;
     width: 100px;
     height: 40px;
 }
 /* 详细页 */
 
 .aritle {
     width: 80%;
     margin: 20px auto;
     background-color: #f5f5f5;
     border: 1px solid #f7fcfe;
     ;
     border-radius: 15px;
     box-shadow: rgb(240, 230, 230);
 }
 
 .aritle-top {
     margin-top: 5px;
     text-align: center;
 }
 
 .aritle p {
     position: relative;
 }
 
 .aritle .aritle-btn {
     margin-left: 10px;
     margin-top: 30px;
     text-align: center;
     position: relative;
     left: 42.5%;
 }
 /* 关于我们 */
 
 .about-about {
     box-sizing: border-box;
     width: 100%;
     height: 500px;
     background-color: #f5f5f5;
     margin-top: 10px;
     margin-bottom: 10px;
     border-radius: 20px;
 }
 
 .about-wrap {
     width: 80%;
     height: 500px;
     margin: 5px auto;
     border-radius: 20px;
     background-color: #fff;
     border: 1px solid #f7fcfe;
     box-shadow: rgb(240, 230, 230);
 }
 
 .about-title {
     width: 100%;
     height: 50px;
     margin-top: 5px;
 }
 
 .about-title .about-title-text {
     font-size: 30px;
     text-align: center;
     color: #1e1e1e;
 }
 
 .about-title-text2 {
     font-size: 10px;
     text-align: center;
     color: #1e1e1e;
 }
 
 .about-mode {
     box-sizing: border-box;
     display: flex;
 }
 
 .about-mode li {
     margin-top: 20px;
     margin-left: 5px;
     width: 25%;
     height: 100px;
     background-color: #26c73d;
     border-radius: 20px;
     position: relative;
     box-shadow: rgb(240, 230, 230);
 }
 
 .about-mode li p {
     display: block;
     text-align: center;
     margin: 0 auto;
     color: #1e1e1e;
     font-family: '微软雅黑', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif
 }
 
 .about-mode li:nth-child(1) {
     margin-left: 2px;
 }
 
 .about-mode li:nth-child(4) {
     margin-right: 2px;
 }
 
 .top-header {
     height: 112px;
 }
 /* 文章列表页面 */
 /* 文章页面 */
 
 .list-wrap {
     margin: 20px auto;
     width: 80%;
     background-color: #e6f0e8;
     border-radius: 15px;
     box-shadow: 0, 0, 0, 0.3;
 }
 
 .list-area {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }
 
 .list-area li {
     box-sizing: border-box;
     width: 33%;
     height: 200px;
     /* background-color: #fce7e6; */
     margin: 5px auto;
     border-radius: 15px;
     background-image: url("https://img0.baidu.com/it/u=3381922033,3536353076&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=281");
 }
 
 .list-area li img {
     width: 200px;
     height: 200px;
     border-radius: 15px;
     position: relative;
 }
 
 .icon-shiju {
     display: block;
     float: right;
     font-size: 200px;
 }
 /* 用户中心 */
 
 .user-wrap {
     justify-content: center;
     margin: 20px auto;
     width: 100%;
     display: flex;
     flex-direction: row;
 }
 
 .user-area {
     margin-right: 10px;
     border-bottom: 200px;
     width: 20%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 
 .user {
     width: 100%;
     background: rgba(255, 255, 255, 0.68);
     margin: 0px auto;
     border: 2px solid rgba(255, 255, 255, 0.68);
     border-radius: 15px;
 }
 
 .user-list {
     display: flex;
     flex-direction: column;
     width: 100%;
     background: rgba(255, 255, 255, 0.68);
 }
 
 .user-list li {
     display: block;
     text-align: center;
     line-height: 50px;
     height: 50px;
     width: 100%;
     border-radius: 10px;
 }
 
 .user-list li:hover {
     background-color: #ebf0f0;
 }
 
 .user-right {
     margin-right: 7%;
     /* float: right; */
     border-bottom: 200px;
     width: 60%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 
 .user-right-list {
     display: flex;
     flex-direction: row;
     justify-content: center;
     width: 100%;
 }
 
 .user-right-list li {
     background-color: #ebf0f0;
     display: block;
     text-align: center;
     line-height: 50px;
     height: 80px;
     width: 20%;
     border-radius: 10px;
     margin: 0px 5px;
     margin-top: 5px;
     display: flex;
     flex-direction: column;
 }
 
 .user-right-list li p {
     font-size: 30px;
     color: #ff5d58;
     margin-bottom: 10px;
 }
 
 .user-right-list li:hover {
     text-decoration: underline;
 }
 
 .bg-primary {
     margin: 5px auto;
     border-radius: 10px;
     background-color: #ebf0f0;
 }
 
 .user-right-manage {
     margin: 10px auto;
     width: 100%;
     height: 40x;
 }
 
 .user-right-manage img {
     width: 100%;
     height: 300px;
     border-radius: 15px;
 }
 
 .user-right-manage-list {
     font-size: 20px;
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
     background-color: #ebf0f0;
     border-radius: 10px;
     margin: 5px auto;
 }
 
 .user-right-manage-list li {
     margin-left: 10px;
     margin: 5px auto;
     width: 40%;
     height: 40px;
     line-height: 40px;
     text-align: center;
 }
 
 .user-right-manage-list li:hover {
     background-color: #ff5d58;
     /* transition: .3s; */
 }
 
 .user-right-manage-list li:visited {
     background-color: #ff5d58;
     transition: .3s;
 }
 
 .user-right-manage-list li:focus {
     background-color: #ff5d58;
     transition: .3s;
 }
 
 .user-right-airtlelist {
     display: flex;
     flex-direction: column;
 }
 
 .user-right-airtlelist li {
     font-family: "微软雅黑";
     width: 100%;
     height: 40px;
     border-radius: 15px;
     background-color: #ebf0f0;
     text-align: center;
     line-height: 40px;
     margin: 2px auto;
 }
 
 .user-right-airtlelist li:hover {
     background-color: #ff5d58;
 }
 
 .user-right-airtlelist {
     float: left;
     overflow: hidden;
     display: none;
     width: 100%;
     height: 0px;
 }
 /* 用户诗词管理 */
 
 .user-text-title {
     width: 100%;
     height: 40px;
     background-color: #ebf0f0;
     border-radius: 10px;
 }
 
 .user-text-title h2 {
     text-align: center;
     line-height: 40px;
     font-size: 30px;
     font-family: "楷体";
 }
 
 .user-right-mytext {
     width: 90%;
     margin: 5px auto;
 }
 
 .user-right-mytext ul {
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }
 
 .user-right-mytext ul li {
     margin: 5px 5px;
     width: 30%;
     height: 100px;
     text-align: center;
     background-color: #ebf0f0;
     line-height: 100px;
     border-radius: 15px;
 }
 
 .user-right-mytext ul li:hover {
     background-color: #ff5d58;
 }
 /* 用户消息中心 */
 
 .xiaoxi {
     width: 100%;
 }
 
 .xiaoxi-list {
     width: 100%;
 }
 
 .xiaoxi-list li {
     width: 80%;
     height: 60px;
     background-color: #ebf0f0;
     margin: 5px auto;
     border-radius: 10px;
     border-bottom: 1px solid black;
     position: relative;
 }
 
 .xiaoxi-list li img {
     width: 40px;
     height: 40xp;
     margin-top: 10px;
     margin-right: 5px;
 }
 
 .xiaoxi-list li p {
     position: absolute;
     right: 10px;
     bottom: 0;
 }
 /* 账号中心 */
 
 .user-manager h2 {
     text-align: center;
     font-family: "微软雅黑";
     margin: 30px auto;
 }
 
 .user-manager p {
     display: block;
     margin: 20px auto;
     margin-left: 30px;
     text-align: left;
 }
 
 .user-manager input {
     border-radius: 15px;
     background-color: #ebf0f0;
     margin: 5px 25px;
     width: 90%;
     height: 30px;
     border-color: transparent;
 }
 
 .user-manager button {
     margin: 0 auto;
 }
 
 .user-manager-button {
     margin: 10px auto;
     display: flex;
     justify-content: center;
     width: 100%;
 }
 
 .btn-manager {
     margin: 20px auto;
     width: 30%;
     height: 30px;
     font-size: 20px;
 }
 
 .list-wrap {
     margin: 20px auto;
     width: 80%;
     background-color: #e6f0e8;
     border-radius: 15px;
     box-shadow: 0, 0, 0, 0.3;
 }
 
 .list-area {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }
 
 .list-area li {
     box-sizing: border-box;
     width: 33%;
     height: 200px;
     /* background-color: #fce7e6; */
     margin: 5px auto;
     border-radius: 15px;
     background-image: url("https://img0.baidu.com/it/u=3381922033,3536353076&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=281");
 }
 
 .list-area li img {
     width: 200px;
     height: 200px;
     border-radius: 15px;
     position: relative;
 }
 
 .icon-shiju {
     display: block;
     float: right;
     font-size: 200px;
 }
 /* 用户中心 */
 
 .user-wrap {
     justify-content: center;
     margin: 20px auto;
     width: 100%;
     display: flex;
     flex-direction: row;
 }
 
 .user-area {
     margin-right: 10px;
     border-bottom: 200px;
     width: 20%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 
 .user {
     width: 100%;
     background: rgba(255, 255, 255, 0.68);
     margin: 0px auto;
     border: 2px solid rgba(255, 255, 255, 0.68);
     border-radius: 15px;
 }
 
 .user-list {
     display: flex;
     flex-direction: column;
     width: 100%;
     background: rgba(255, 255, 255, 0.68);
 }
 
 .user-list li {
     display: block;
     text-align: center;
     line-height: 50px;
     height: 50px;
     width: 100%;
     border-radius: 10px;
 }
 
 .user-list li:hover {
     background-color: #ebf0f0;
 }
 
 .user-right {
     margin-right: 7%;
     /* float: right; */
     border-bottom: 200px;
     width: 60%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 
 .user-right-list {
     display: flex;
     flex-direction: row;
     justify-content: center;
     width: 100%;
 }
 
 .user-right-list li {
     background-color: #ebf0f0;
     display: block;
     text-align: center;
     line-height: 50px;
     height: 80px;
     width: 20%;
     border-radius: 10px;
     margin: 0px 5px;
     margin-top: 5px;
     display: flex;
     flex-direction: column;
 }
 
 .user-right-list li p {
     font-size: 30px;
     color: #ff5d58;
     margin-bottom: 10px;
 }
 
 .user-right-list li:hover {
     text-decoration: underline;
 }
 
 .bg-primary {
     margin: 5px auto;
     border-radius: 10px;
     background-color: #ebf0f0;
 }
 
 .user-right-manage {
     margin: 10px auto;
     width: 100%;
     height: 40x;
 }
 
 .user-right-manage img {
     width: 100%;
     height: 300px;
     border-radius: 15px;
 }
 
 .user-right-manage-list {
     font-size: 20px;
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
     background-color: #ebf0f0;
     border-radius: 10px;
     margin: 5px auto;
 }
 
 .user-right-manage-list li {
     margin-left: 10px;
     margin: 5px auto;
     width: 40%;
     height: 40px;
     line-height: 40px;
     text-align: center;
 }
 
 .user-right-manage-list li:hover {
     background-color: #ff5d58;
     /* transition: .3s; */
 }
 
 .user-right-manage-list li:visited {
     background-color: #ff5d58;
     transition: .3s;
 }
 
 .user-right-manage-list li:focus {
     background-color: #ff5d58;
     transition: .3s;
 }
 
 .user-right-airtlelist {
     display: flex;
     flex-direction: column;
 }
 
 .user-right-airtlelist li {
     font-family: "微软雅黑";
     width: 100%;
     height: 40px;
     border-radius: 15px;
     background-color: #ebf0f0;
     text-align: center;
     line-height: 40px;
     margin: 2px auto;
 }
 
 .user-right-airtlelist li:hover {
     background-color: #ff5d58;
 }
 
 .user-right-airtlelist {
     float: left;
     overflow: hidden;
     display: none;
     width: 100%;
     height: 0px;
 }
 /* 用户诗词管理 */
 
 .user-text-title {
     width: 100%;
     height: 40px;
     background-color: #ebf0f0;
     border-radius: 10px;
 }
 
 .user-text-title h2 {
     text-align: center;
     line-height: 40px;
     font-size: 30px;
     font-family: "楷体";
 }
 
 .user-right-mytext {
     width: 90%;
     margin: 5px auto;
 }
 
 .user-right-mytext ul {
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }
 
 .user-right-mytext ul li {
     margin: 5px 5px;
     width: 30%;
     height: 100px;
     text-align: center;
     background-color: #ebf0f0;
     line-height: 100px;
     border-radius: 15px;
 }
 
 .user-right-mytext ul li:hover {
     background-color: #ff5d58;
 }
 /* 用户消息中心 */
 
 .xiaoxi {
     width: 100%;
 }
 
 .xiaoxi-list {
     width: 100%;
 }
 
 .xiaoxi-list li {
     width: 80%;
     height: 60px;
     background-color: #ebf0f0;
     margin: 5px auto;
     border-radius: 10px;
     border-bottom: 1px solid black;
     position: relative;
 }
 
 .xiaoxi-list li img {
     width: 40px;
     height: 40xp;
     margin-top: 10px;
     margin-right: 5px;
 }
 
 .xiaoxi-list li p {
     position: absolute;
     right: 10px;
     bottom: 0;
 }
 /* 账号中心 */
 
 .user-manager h2 {
     text-align: center;
     font-family: "微软雅黑";
     margin: 30px auto;
 }
 
 .user-manager p {
     display: block;
     margin: 20px auto;
     margin-left: 30px;
     text-align: left;
 }
 
 .user-manager input {
     border-radius: 15px;
     background-color: #ebf0f0;
     margin: 5px 25px;
     width: 90%;
     height: 30px;
     border-color: transparent;
 }
 
 .user-manager button {
     margin: 0 auto;
 }
 
 .user-manager-button {
     margin: 10px auto;
     display: flex;
     justify-content: center;
     width: 100%;
 }
 
 .btn-manager {
     margin: 20px auto;
     width: 30%;
     height: 30px;
     font-size: 20px;
 }
 /* 文章详细列表 */
 
 * {
     margin: 0;
     padding: 0;
 }
 
 .media img {
     width: 125px;
     height: 100px;
 }
 
 .banner {
     width: 100%;
     border-radius: 15px;
 }
 
 .dark-mode {
     background-color: black;
     color: white;
 }
 /* 回到顶部 */
 
 .return-top {
     position: fixed;
     bottom: 50px;
     right: 30px;
 }
 
 .return-top img {
     width: 40px;
     height: 40px;
 }
 /* 回到顶部结束 */
 /* 标签开始 */
 
 .text {
     width: 75%;
     margin: 0 auto;
     font-size: 30px;
     margin: 20px auto;
     font-family: 'KaiTi';
 }
 
 .text h1 {
     text-align: center;
     margin-bottom: 20px;
     position: relative;
 }
 
 .text ::after {
     content: " ";
     position: absolute;
     -bkit-border-radius: 50%;
     border-radius: 50%;
     background: #ff5d58 !important;
     width: 12px;
     height: 12px;
     -webkit-box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     box-shadow: 20px 0 #ffb528, 40px 0 #26c73d;
     top: 5px;
     right: 45px;
 }
 
 :hover>h1 {
     border-bottom: 2px solid #ddd;
 }
 
 .editor {
     background: rgba(255, 255, 255, 0.68);
     margin: 0px auto;
     width: 75%;
     border: 0px;
     border-radius: 15px;
 }
 
 .editor-wrap {
     margin: 0 auto;
     width: 100%;
 }
 
 .editor-area {
     border-bottom: 200px;
     width: 75%;
     background: rgba(255, 255, 255, 0.68);
     border-radius: 20px;
     box-shadow: 0px 0px 10px -2px rgb(158 158 158 / 20%);
 }
 /* 输入题目狂 */
 
 .editor input {
     border-bottom: 2px solid #343a40;
     outline: 0!important;
     border: none;
     display: block;
     width: 100%;
     padding: 1em 2em .4em .3em;
     opacity: .8;
     transition: .3s;
     background: 0 0!important;
     height: 46px;
     padding: 10px 16px;
     font-size: 18px;
     line-height: 1.3333333;
     border-radius: 6px;
 }
 
 .editor :hover {
     border-bottom: 3px solid #f5f5f5;
 }
 
 .editor button {
     margin: 10px auto;
 }
 /* 发布诗词 */
 
 .line-post {
     margin-top: 20px;
     margin: 20px auto;
     width: 100px;
     height: 40px;
 }
 /* 诗人详细页 */
 
 .aritle {
     width: 80%;
     margin: 20px auto;
     background-color: #f5f5f5;
     border: 1px solid #f7fcfe;
     ;
     border-radius: 15px;
     box-shadow: rgb(240, 230, 230);
 }
 
 .aritle-top {
     text-align: left;
     text-indent: 2em;
 }
 
 .aritle p {
     font-size: 15px;
     position: relative;
     margin: 10px 35px;
 }
 
 .aritle img {
     width: 200px;
     height: 250px;
     float: left;
     margin: 12px 15px 5px 36px;
 }
 /*点赞 收藏 转发*/
 
 :root {
     --bg-color: #dddddd;
     --icon-color: #c5c5c5;
     --icon-chose-color: #ee1818;
     --icon-light-color: #fff;
     --icon-dark-color: #a3a2a3;
 }

 
 .content {
     display: flex;
     font-size: 10px;
     justify-content: right;
     align-items: center;
 }
 
 .content .content_box {
     width: 98px;
     height: 88px;
     margin-top: 10px;
 }
 
 .content .content_box .quantity {
    font-size: 13px;
    color: black;
 }
 
 .icon-checkbox {
     display: none;
 }
 
 .icon {
     flex: none;
     display: flex;
     background-color: var(--bg-color);
     width: 5rem;
     height: 5rem;
     margin: 1rem 1.5rem;
     margin-right: 33px;
     margin-bottom: 2px;
     justify-content: center;
     align-items: center;
     box-shadow: 5px 5px 14px var(--icon-dark-color), -5px -5px 14px var(--icon-light-color), 0px 0px 0px 80px var(--bg-color) inset, -10px -10px 40px var(--icon-light-color) inset, 10px 10px 25px var(--icon-dark-color) inset;
     border-radius: 50%;
     cursor: pointer;
     transition: all 0.3s;
 }
 
 .icon-checkbox:checked+.icon {
     box-shadow: 5px 5px 14px var(--icon-dark-color), -5px -5px 14px var(--icon-light-color), 0px 0px 0px 0px var(--bg-color) inset, 10px 10px 40px var(--icon-light-color) inset, -10px -10px 25px var(--icon-dark-color) inset;
 }
 
 .iconfonts {
     font-family: "iconfont" !important;
     font-size: 4rem;
     font-style: normal;
     font-weight: 900;
     color: var(--icon-color);
     transition: all 0.1s 0.3s;
 }
 
 .icon-checkbox:checked+.icon>.iconfonts {
     color: var(--icon-chose-color);
     text-shadow: 0px 0px 1px var(--icon-chose-color);
 }
  
 .poetry .gaunzhuspan_user {
     display: inline-block;
     left: 85%;
     top: 10px;
     background-color: rgb(247 247 247 / 0%);
     position: relative;
     margin: 10px 35px;
     text-align: center;
 }
 .guanzhu{
     
 }
 .gaunzhu_user {
     font-family: "iconfont" !important;
     /* font-size: 3rem; */
     font-style: normal;
     font-weight: 900;
     color: var(--icon-color);
     transition: all 0.1s 0.3s;
 }
 /* 古诗详情页*/
 
 .poetry {
     font-family: "楷体";
     width: 80%;
     margin: 110px auto;
     background-color: rgb(241 241 241 / 38%);
     border: 1px solid #f7fcfe;
     border-radius: 15px;
     box-shadow: rgb(240, 230, 230);
 }
 
 .poetry p {
     font-size: 15px;
     position: relative;
     margin: 10px 35px;
     text-align: center;
 }
 

.poetry .poetry-artile {
    padding-top: 10px;
    font-size: 18px;
}
 
 
 .poetry .poetry-topic {
     font-size: 30px;
     margin-top: 100px;
 }
 
 .poetry .poetry-content {
    font-size: 21.89px;
    line-height: 33.7px;
    margin-bottom: 40px;
    width: 300px;
    margin: 0 auto;
    word-break: break-word;
    text-align: center;
    }
 
 .poetry .poetry-contents {
     font-size: 18px;
     margin-bottom: 40px;
     width: 300px;
     margin: 0 auto;
     word-break: break-word;
     text-align: left;
 }
  
.explain {
    width: 100%;
    /* background-color: rgb(215, 26, 26); */
    font-size: 19px;
    margin: 30px 0px;
    padding: 10px 100px;
}

.explain p {
    font-size: 27px;
    text-align: left;
    margin: 15px 5px;
    font-family: "隶书";
}
 /*评论区 */
 
 .dycontainer {
     width: 80%;
     min-height: 10px;
     margin: 50px auto;
     padding-left: 40px;
 }
 
 .avatary img {
    height: 60px;
    margin: 0px 6px;
 }
 
 .contently {
     padding-top: 15px;
     border-top: 1px solid #dfdfdf;
    background-color: rgb(247 247 247 / 68%);
     padding-left: 10px;
     margin-left: 12px;
     border-radius: 4px;
 }
  .huifu {
    font-size: 12px;
    border-top: 1px solid #872a2a;
    background-color: rgb(247 247 247 / 68%);
    padding-top: 15px;
    padding-left: 80px;
    margin-left: 14px;
    border-radius: 4px;
}

 .reply {
     background-color: rgb(247 247 247);
 }
 
 .bottom>.contently {
     border-bottom: 1px solid #dfdfdf;
 }
 
 .contently-name {
     color: #6d757a;
     font-size: 16px;
     margin-bottom: 5px;
     margin-left: 10px;
 }
 
 .contently-article {
     font-size: 14px;
     margin-bottom: 10px;
     margin-left: 25px;
     word-break: break-all;
     padding-right: 100px;
     padding-left: 7px;
 }
 
 .contently-footer {
     color: #6d757a;
     font-size: 12px;
     margin-bottom: 0px;
 }
 
 .footer span {
     margin-left: 10px;
 }
 
 .sends {
     position: relative;
     margin-bottom: 13px;
 }
 
 .sends-input {
     outline: none;
     box-sizing: border-box;
     transition: all 0.3s;
     position: absolute;
     top: 0px;
     resize: none;
     width: 89%;
     height: 59px;
     padding: 10px;
     border-radius: 4px;
     background: #f4f5f7;
     border: 1px solid #e5e9ef;
 }
 
 .sends-input:hover,
 .sends-input:active {
     background: #fff;
     color: #555;
 }
 
 .sends-button {
     border: none;
     cursor: pointer;
     user-select: none;
     transition: all 0.3s;
     position: absolute;
     top: 0px;
     right: 0px;
     width: 65px;
     height: 59px;
     border-radius: 4px;
     background: #1aa2d4;
     color: #fff;
     font-size: 14px;
     text-align: center;
 }
 
 .contently-footer-timestamp {
     margin-right: 10px;
 }
 
 .sends-button:hover {
     background: #1eb6e3;
 }
 
 .check {
     float: right;
     width: 50px;
     height: 20px;
 }
 
 .reply {
     border: 0px;
     background-color: #fff;
 }
 
 .neirung {
     padding: 8px 20px;
     background: #fff;
     border: none;
     border-radius: 0px;
     width: 100%;
     font-size: 16px;
     color: #777777;
     border: 1px solid transparent;
 }
 
 .contents {
     /* margin-left: 20px; */
     font-size: 12px;
     border-top: 1px solid #dfdfdf;
     padding-top: 15px;
     padding-left: 80px;
 }
 /* 关于我们 */
 
 .about-about {
     box-sizing: border-box;
     width: 100%;
     height: 500px;
     background-color: #f5f5f5;
     margin-top: 10px;
     margin-bottom: 10px;
     border-radius: 20px;
 }
 
 .about-wrap {
     width: 80%;
     height: 500px;
     margin: 5px auto;
     border-radius: 20px;
     background-color: #fff;
     border: 1px solid #f7fcfe;
     box-shadow: rgb(240, 230, 230);
 }
 
 .about-title {
     width: 100%;
     height: 50px;
     margin-top: 5px;
 }
 
 .about-title .about-title-text {
     font-size: 30px;
     text-align: center;
     color: #1e1e1e;
 }
 
 .about-title-text2 {
     font-size: 10px;
     text-align: center;
     color: #1e1e1e;
 }
 
 .about-mode {
     box-sizing: border-box;
     display: flex;
 }
 
 .about-mode li {
     margin-top: 20px;
     margin-left: 5px;
     width: 25%;
     height: 100px;
     background-color: #26c73d;
     border: 1px solid red;
     border-radius: 20px;
     position: relative;
     box-shadow: rgb(240, 230, 230);
 }
 
 .about-mode li:nth-child(1) {
     margin-left: 2px;
 }
 
 .about-mode li:nth-child(4) {
     margin-right: 2px;
 }
 
 .top-header {
     /* min-width: */
     /* max-width: */
     height: 112px;
 }
 /* 文章详细列表结束 */