@charset "UTF-8";
img{ width:100%; }
main { background: none; }
.main-top { margin: 10px 0 0 0; }
.pp-tab-top { padding: 5px 3px 0 3px; border-bottom: 1px solid #eee; }
.block-top { margin: 11px 8px 0 8px; padding-bottom: 6px; }


/*作品赏析*/
.shangxi-block { }
.shangxi-list { }
.shangxi-list ul li { width: 96%; margin: 0 2% 10px 2%; padding: 0; font-size: 14px; color: #555; display: block; overflow: hidden; background: #fff; position: relative; /*border-bottom: 1px dashed #eee; */border-radius: 8px; }
.shangxi-list ul li .shangxi-item { display: block; overflow: hidden; }
.shangxi-list ul li .shangxi-item .shangxi-pic { width: 100%; height:0; padding-bottom: 60%; margin: 0; display: block; overflow: hidden; background: #ddd; border: 1px solid #f3f3f3; border-radius: 2px; position: relative; }
.shangxi-list ul li .shangxi-item .shangxi-pic a { display: block; }
.shangxi-list ul li .shangxi-item .shangxi-pic img { width: 100%; height: 100%; object-fit: cover; position: absolute; }
.shangxi-list ul li .shangxi-item .shangxi-info { margin: 11px 10px; position: relative; display: block; overflow: hidden; }
.shangxi-list ul li .shangxi-item .shangxi-info .shangxi-top { display: block; overflow: hidden; }
.shangxi-list ul li .shangxi-item .shangxi-info .shangxi-top h3 { width: 70%; font-size: 16px; color: #333; float: left; }
.shangxi-list ul li .shangxi-item .shangxi-info .shangxi-top span { padding: 3px 0; font-size: 14px; color: #777; float: right; }
.shangxi-list ul li .shangxi-item .shangxi-info .shangxi-desc { margin: 8px 0 0 0; font-size: 13px; color: #999; line-height: 22px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.shangxi-list ul li img { -webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s; }
.shangxi-list ul li:hover img { -webkit-transform: scale(1.2);-moz-transform: scale(1.2);-o-transform: scale(1.2);transform: scale(1.2); }
.shangxi-list ul li:hover h3 a { color: #dd801a; }


/*赏析详情*/
.shangxi-detail-block { margin: 0 0 10px 0; background: #fff; display: block; overflow: hidden; }
.sx-good-box { margin: 12px 8px; padding:9px 8px; display: block; overflow: hidden; background: #eee; border: 1px solid #eee; border-radius: 4px; }
.sx-good-box .sx-good-pic { width: 120px; height: 90px; margin: 0 9px 0 0; float: left; display: block; overflow: hidden; background: #ddd; border-radius: 4px; }
.sx-good-box .sx-good-pic img { width: 120px; height: 90px; object-fit: cover; }
.sx-good-box .sx-good-info { }
.sx-good-box .sx-good-info .sx-good-title { padding: 2px 0 6px 0; display: block; overflow: hidden; }
.sx-good-box .sx-good-info .sx-good-title h3 { padding: 4px 10px 5px 0; font-size: 16px; color: #333; float: left; }
.sx-good-box .sx-good-info .sx-good-title span { width: 80px; height: 28px; margin-top:2px; line-height: 28px; background: #d33; font-size: 12px; color: #fff; border-radius: 50px; display: block; overflow: hidden; text-align: center; }
.sx-good-box .sx-good-info .sx-good-title span a { font-size: 12px; color: #fff; display: block; }
.sx-good-box .sx-good-info .sx-good-message { font-size: 12px; color: #888; display:block; overflow: hidden; }
.sx-good-box .sx-good-info .sx-good-message p { display:block; overflow: hidden; }
.sx-good-box .sx-good-info .sx-good-message span { margin: 3px 1% 3px 0; float: left; display:block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.sx-good-box .sx-good-info .sx-good-message span.left { width: 90px; }
.sx-good-box .sx-good-info .sx-good-message span.right { width: 52.3%; }

.shangxi-content { }
.shangxi-content .detail-desc { margin: 15px 8px; line-height: 22px; color: #666; }
.shangxi-content .detail-desc p { margin: 12px 0; display:block; overflow: hidden; text-indent: 2em; }
.shangxi-content .detail-pic { margin: 12px 8px; }
.shangxi-content .detail-pic img { margin: 5px 0; display: block; border-radius: 3px; width: auto; max-width: 100%; }



/*右侧样式*/
.side-article-list{ margin:5px 9px 10px 9px;}
.side-article-list ul{width:100%;}
.side-article-list ul li{ text-align:left; margin: 0; height: 30px; padding: 0; line-height: 30px; border-radius: 4px; font-size: 14px; color: #555; display: block; overflow: hidden; }
.side-article-list ul li a { width: 100%; margin: 0; color: #555; }
.side-article-list ul li a:hover { color: #dd801a; }
.side-article-list ul li a:hover i { color: #dd801a; }
.side-article-list ul li a:hover span { color: #dd801a; }
.side-article-list ul li a h3 { width: 76%; float: left; font-size: 14px; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-article-list ul li i { padding-right: 7px; float: left; text-align:left; font-size: 15px; color: #9195A3; font-weight: bold; }
.side-article-list ul li span { width: 50px; float: right; text-align: right; font-size: 13px; color: #999; margin-top: 1px; }


.side-master-list  { padding:6px 0; margin: 0; display: block; overflow: hidden; background: #fff; border-radius: 6px; }
.side-master-list ul li{ text-align:left; margin: 0 8px; padding: 8px 0; font-size: 14px; color: #555; display: block; overflow: hidden; position: relative; border-bottom: 1px dashed #eee; border-radius: 4px; }
.side-master-list ul li:last-child { border-bottom: none; }
.side-master-list ul li .master-text a { font-size: 15px; color: #666; padding: 6px 0 5px 0; display: block; overflow: hidden; }
.side-master-list ul li h3 { width:auto; padding: 0; float: left; font-size: 15px; color: #666; }
.side-master-list ul li .honor { font-size: 14px; color: #bbab91; font-weight: normal; padding: 1px 0 0 8px; float: left; }
.side-master-list ul li p { width:auto; }
.side-master-list ul li .master-pic { width: 80px; height: 80px; margin: 0 0 0 9px; float: right; display: block; overflow: hidden; background: #ddd; border: 1px solid #f3f3f3; border-radius: 82px; }
.side-master-list ul li .master-pic img { width: 80px; height: 80px; object-fit: cover; }
.side-master-list ul li .master-text { height:80px; position: relative; display: block; overflow: hidden; }
.side-master-list ul li .master-text p { font-size: 13px; color: #999; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  }
.side-master-list ul li .master-foot { font-size: 13px; color: #bbb; position: absolute; bottom: 0; left: 0; right: 0; }
.side-master-list ul li .master-foot i { float: left; }
.side-master-list ul li .master-foot span { float: right; }


.side-good-list { margin: 2px 3px; padding: 0 0 7px 0; display: block; overflow: hidden; }
.side-good-list ul { width: 100%; margin: 0; }
.side-good-list ul li { width: 47%; margin: 1px 1.5%; display: block; float: left; }
.side-good-list ul li .side-good-item { /* border: 1px solid #f6f6f6; background: #f9f9f9;*/ box-shadow:3px 5px 9px rgba(0,0,0,.05); }
.side-good-list ul li a { width: 100%; margin: 0; display: block; overflow: hidden; color: #555; }
.side-good-list ul li i { width: 100%; height: 0; padding-bottom: 80%; display: block; overflow: hidden; position: relative; background: #333; font-size: 0; margin: 0; }
.side-good-list ul li i img { width: 100%; height: 100%; object-fit: cover; display: block; overflow: hidden; position: absolute; }
.side-good-list ul li h3 { padding: 1px 0; font-size: 15px; color: #555; display: block; overflow: hidden; }
.side-good-list ul li p { padding: 3px 0 10px 0; font-size: 13px; color: #999; display: block; overflow: hidden; }


.ul-number li:nth-child(1) i{ color: #FE2D46; }
.ul-number li:nth-child(1) i:before{content:"1";}
.ul-number li:nth-child(2) i{ color: #F60; }
.ul-number li:nth-child(2) i:before{content:"2";}
.ul-number li:nth-child(3) i{ color: #FAA90E; }
.ul-number li:nth-child(3) i:before{content:"3";}
.ul-number li:nth-child(4) i{ color: #9ebaa0; }
.ul-number li:nth-child(4) i:before{content:"4";}
.ul-number li:nth-child(5) i{ color: #4796b3; }
.ul-number li:nth-child(5) i:before{content:"5";}
.ul-number li:nth-child(6) i{ color: #bb9998; }
.ul-number li:nth-child(6) i:before{content:"6";}
.ul-number li:nth-child(7) i{ color: #9195A3; }
.ul-number li:nth-child(7) i:before{content:"7";}
.ul-number li:nth-child(8) i{ color: #9195A3; }
.ul-number li:nth-child(8) i:before{content:"8";}
.ul-number li:nth-child(9) i{ color: #9195A3; }
.ul-number li:nth-child(9) i:before{content:"9";}
.ul-number li:nth-child(10) i{ color: #9195A3; }
.ul-number li:nth-child(10) i:before{content:"10";}
.ul-number li:nth-child(11) i{ color: #9195A3; }
.ul-number li:nth-child(11) i:before{content:"11";}
.ul-number li:nth-child(12) i{ color: #9195A3; }
.ul-number li:nth-child(12) i:before{content:"12";}


/*屏幕小于1024px*/
@media screen and (min-width:0px) and (max-width:1024px){

    .main { padding-bottom: 50px; }
    .main-tab { width: 40%; margin: 10px auto; background: #fffbe4;  }
    .main-tab li { width: 50%; margin: 0; padding: 5px 0; text-align: center; font-size: 14px; color: #888; }
    .main-tab li.current { background: #e1a768; color: #fff; border-bottom:none; }

    .aside { display: none; }

}



/*屏幕大于1024px*/
@media screen and (min-width:1025px){

    .pp-block{display:block;overflow:hidden; margin:0 0 10px 0; padding:6px;border-radius:6px;background:#fff;}
    .block-top { margin: 5px 8px 0 8px; padding-bottom: 6px; }

    .shangxi-main { width: 70%; float: left; display: block !important;}
    .aside { width: 29%; float: right; display: block !important;}
    .side-block { margin: 0 0 10px 0; }

    .shangxi-detail-block { padding: 8px; }
    .shangxi-list ul li { width: 49%; margin: 0 0.5% 10px 0.5%; float: left; }
    /*.shangxi-list ul li .shangxi-item .shangxi-pic { width: 180px; height: 150px; margin: 10px; padding: 0; float: left; display: block; overflow: hidden; background: #ddd; border: 1px solid #f3f3f3; border-radius: 4px; }*/
    /*.shangxi-list ul li .shangxi-item .shangxi-pic img { width: 180px; height: 150px; object-fit: cover; }*/
    .shangxi-list ul li .shangxi-item .shangxi-info { margin: 13px 15px; display: block; overflow: hidden; }
    .shangxi-list ul li .shangxi-item .shangxi-info .shangxi-top h3 { /*width: 70%; font-size: 16px; color: #333; float: left;*/ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; float: left; }
    .shangxi-list ul li .shangxi-item .shangxi-info .shangxi-top span { padding: 3px 5px; font-size: 14px; color: #666; float: right; }
    .shangxi-list ul li .shangxi-item .shangxi-info .shangxi-desc { height: 46px; margin: 8px 0 0 0; font-size: 13px; color: #999; line-height: 22px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; }


}
