/**
 +------------------------------------------------------------------------------
 * 网站样式重写
 +------------------------------------------------------------------------------
 */
 html{-webkit-text-size-adjust:none;overflow-x: hidden;}
 body{ font-size: 1.4rem;color:#282828; font-family:"PingFang SC", "思源黑体", "思源宋体",Helvetica,Arial,sans-serif;-moz-osx-font-smoothing: grayscale;overflow-x: hidden;}
*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} 

html{zoom:1;}html *{outline:0;zoom:1;} html button::-moz-focus-inner{border-color:transparent!important;} 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
fieldset,a img{border:0;} address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;} li{list-style:none;} caption,th{text-align:left;} 
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:600;color:#282828;-moz-osx-font-smoothing: auto;} 
q:before,q:after{content:'';}
input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/} em,i{ font-style:normal;}

a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {color:#8965CF;text-decoration:none;}
a:active {text-decoration: none;}
a:focus,input:focus{outline:none;}



@media (max-width: 768px) {
    .index .warpBox.indexBox{position: relative; margin-bottom: 40px;}
}





/*warpBox区域*/
.main{ width: 100%;clear: both; margin-top: 20px; min-height: calc(100vh - 420px);}
.typeSort .main,.home .main{ margin-top:0px}
.main .topPost,.main .topTags{ margin: 0;background:#fff;}
.index .warpBox.indexBox{position: relative; }
.warpBox .img{font-size: 0;width: 100%;background-color: #fff; margin-top: -20px;}
.warpBox .img img{object-fit: cover;width: 100%;height: auto; display: block; margin: 0 auto; font-size: 0;}
.warpBox .img img.mob{ display: none;}
.warpBox .text{ position: relative; width: 100%}

.btn a:after,.btn .get:after{content: "\EA6C"; font-family: remixicon; display: inline-block; vertical-align: 0; margin-left:3px;}
.btn{cursor: pointer;width: 176px;height: 48px;border-radius: 48px;text-align: center;line-height: 48px;font-size: 16px;font-weight: 500;color: #fff;transition: 0.3s; margin: 0 auto; overflow: hidden;position: relative; z-index: 1;}
.btn a,.btn .get{ display:block;}
.warpBox .btn a,.warpBox .btn .get{ color: #fff;background: #8965CF;height: 100%;}
.warpBox .slogan .img{ position: relative;}
.warpBox .slogan .img .btn{position: absolute; top:30%; left: 50%; transform: translateX(-50%);} 
.warpBox .data{width: 100%;background-color:#8965CF;padding: 25px 0;}
.warpBox .data ul{box-sizing: border-box;display: flex;align-items: center;justify-content: center;height: 100%;}
.warpBox .data li{flex: 1;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: space-evenly; position: relative;}
.warpBox .data li:after{ content:''; width: 1px; height: 48px; background-color: #ffffff2b; position: absolute; right: 0; top: 50%; margin-top: -24px;}
.warpBox .data li:last-of-type:after{display:none;}
.warpBox .data li .item{ text-align: left;font-size: 16px;color: #fff;line-height: 1.4;padding-left: 48px; position: relative;}
.warpBox .data li .item i{ font-size: 34px; position: absolute; left: 0; top: -5px;}
.warpBox .data li .item .nums{font-size: 32px;color: #fff;line-height: 1.1;font-weight: 500;-moz-osx-font-smoothing: auto;font-family: Arial;}
.warpBox .data li .item em{color: #fff;}

.index .warpBox .typeBox{display: flex;justify-content: space-around;flex-wrap: wrap;}
.index .warpBox .typeBox li{flex: 0 0 auto; width: calc(100% / 2 - 40px); margin: 0px 20px 30px 20px; background-color: #fff; padding: 30px 20px;border-radius: 10px;border: 3px solid rgba(255,255,255,0);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;height: auto;width: 816px;}
.index .warpBox .typeBox li .item{float: left;width: 100%;display: flex;justify-content: space-between;margin-top: 30px;}
.index .warpBox .typeBox .item a{flex: 1; display: flex;flex-direction: column;align-items: center;transition: 0.3s;cursor: pointer;}
.index .warpBox .typeBox .item .pic {width: 100px;height: 100px;font-size: 0;display: flex;align-items: flex-end; position: relative; overflow: hidden;}
.index .warpBox .typeBox .item .pic img{width: 100px;height: 100px; max-width: none;position: absolute; left: 0; top: 0;border-radius:20px;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;overflow: hidden; display: block;}
.index .warpBox .typeBox .item .pic img:first-of-type{opacity: 1; background-color: #e7ecfc; }
.index .warpBox .typeBox .item .pic img:last-of-type{opacity: 0;}
.index .warpBox .typeBox li:hover .item a:nth-child(1) .pic img{background-color: #5857ff;}
.index .warpBox .typeBox li:hover .item a:nth-child(2) .pic img{background-color: #ab9aff;}
.index .warpBox .typeBox li:hover .item a:nth-child(3) .pic img{background-color: #ffc1c1;}
.index .warpBox .typeBox li:hover .item a:nth-child(4) .pic img{background-color: #f4c56b;}

/* .index .warpBox .typeBox li:hover .item a .pic img:first-of-type{opacity: 0;}
.index .warpBox .typeBox li:hover .item a .pic img:last-of-type{opacity: 1;} */
.index .warpBox .typeBox li .item a:hover .pic img:first-of-type{opacity: 0;}
.index .warpBox .typeBox li .item a:hover .pic img:last-of-type{opacity: 1;}

.index .warpBox .typeBox li h3{font-size: 32px; color:currentcolor;line-height: 1.1; text-align: center;letter-spacing: 2px;}
.index .warpBox .typeBox li h4{margin-top: 15px;font-size:18px;font-weight: 600;}
.index .warpBox .typeBox li h4 span{font-size:16px; opacity: 1; margin-top: 0;font-weight: 600;}
.index .warpBox .typeBox li span{font-size: 14px; font-weight: normal;margin-top:3px;opacity: 0.68;color: #282828;}
.index .warpBox .typeBox li.sort0,.index .warpBox .typeBox li.sort0 a{color: #7D91EC;}
.index .warpBox .typeBox li.sort0:after{background: linear-gradient(180deg, #7D91EC40, rgba(255,255,255,0) );}
.index .warpBox .typeBox li.sort1,.index .warpBox .typeBox li.sort1 a{color: #B1B482;}
.index .warpBox .typeBox li.sort1:after{background: linear-gradient(180deg, #B1B48240, rgba(255,255,255,0) );}
.index .warpBox .typeBox li.sort2,.index .warpBox .typeBox li.sort2 a{color: #E29171;}
.index .warpBox .typeBox li.sort2:after{background: linear-gradient(180deg, #E2917140, rgba(255,255,255,0) );}
.index .warpBox .typeBox li.sort3,.index .warpBox .typeBox li.sort3 a{color: #946EDF;}
.index .warpBox .typeBox li.sort3:after{background: linear-gradient(180deg, #946EDF40, rgba(255,255,255,0) );}



.category .warpBox.indexBox .container{ padding: 0;}
.category .warpBox .typeBox{display: flex;justify-content: space-around;flex-wrap: wrap;margin: -15px 0 30px;}
.category .warpBox .typeBox li{flex: 0 0 auto; width: 100%;height: 400px;}
.category .warpBox .typeBox li .item{float: left;width: 100%;transform: translateY(50px);display: flex;justify-content: space-between;margin-top: 10px;padding: 0 200px;}
.category .warpBox .typeBox .item a{flex: 1; display: flex;flex-direction: column;align-items: center;transition: 0.3s;cursor: pointer;}
.category .warpBox .typeBox .item a:hover{transform: translateY(-10px);}
.category .warpBox .typeBox .item .pic {font-size: 0;display: flex;align-items: flex-end;}
.category .warpBox .typeBox .item .pic img{width: auto;height: 160px;max-width: none;}
.category .warpBox .typeBox .item .pic img:first-of-type{margin-right: -13px;}
.category .warpBox .typeBox .item .pic img:last-of-type{margin-left: -13px;margin-bottom: -8px;}
.category .warpBox .typeBox li h3{font-size: 40px;font-weight: 800;color: currentcolor;opacity: 0.2;transform: translateY(50px); margin: 0; text-align: center;}
.category .warpBox .typeBox li h4{margin-top: 20px;font-size: 20px;font-weight: 600;}
.category .warpBox .typeBox li h4 span{font-size: 20px; opacity: 1; margin-top: 0;}
.category .warpBox .typeBox li span{font-size: 16px; font-weight: 500; color:currentcolor;margin-top: 12px;opacity: 0.6;}
.category .warpBox .typeBox li:after{ content: ''; display: block; width: 100%;margin-top: 195px;height: 140px;background: linear-gradient(180deg, #dfd2ec, rgba(255,255,255,0) );}
.category .warpBox .typeBox li.sort0,.warpBox .typeBox li.sort0 a{color: #7D91EC;}
.category .warpBox .typeBox li.sort0:after{background: linear-gradient(180deg, #7D91EC40, rgba(255,255,255,0) );}
.category .warpBox .typeBox li.sort0 h4{color:currentcolor;}
.category .warpBox .typeBox li.sort1,.warpBox .typeBox li.sort1 a{color: #B1B482;}
.category .warpBox .typeBox li.sort1:after{background: linear-gradient(180deg, #B1B48240, rgba(255,255,255,0) );}
.category .warpBox .typeBox li.sort1 h4{color:currentcolor;}
.category .warpBox .typeBox li.sort2,.warpBox .typeBox li.sort2 a{color: #E29171;}
.category .warpBox .typeBox li.sort2:after{background: linear-gradient(180deg, #E2917140, rgba(255,255,255,0) );}
.category .warpBox .typeBox li.sort2 h4{color:currentcolor;}
.category .warpBox .typeBox li.sort3,.warpBox .typeBox li.sort3 a{color: #946EDF;}
.category .warpBox .typeBox li.sort3:after{background: linear-gradient(180deg, #946EDF40, rgba(255,255,255,0));}
.category .warpBox .typeBox li.sort3 h4{color:currentcolor;}

.category .warpBox .topBtn{ margin-top: 50px;}
.category .warpBox .fotBtn{ margin-bottom: 50px;}

.umTab{text-align: center;margin:0px auto;display: flex;flex-wrap: wrap;justify-content: end; padding-right: 8px;}
.umTab li span{position: relative;display: block;height: 34px; line-height: 34px;font-size:18px;color: #282828;font-weight: normal;cursor:pointer;transition: 0.3s; margin: 0px;padding: 0 12px;-webkit-border-radius: 5px;border-radius: 5px;}
.umTab li.active span{ background-color: #8965CF; color: #fff;}
.umTab li.active:hover span{color: #fff;}
.umTab li:hover span{color: #8965CF;}

.umTabBox{ padding:10px 10px 10px 30%; border: 1px solid #eee;-webkit-border-radius: 10px;border-radius: 10px; margin: 0 0 30px 0;position: relative;}

.umTabSc{ position: absolute; left: 20px; top: 21px; width: 30%;}
.umTabSc .sinput{border: medium none;background: none; height: 30px;}
.umTabSc  i{ opacity: .68; margin-right: 3px;}

.umTabCon ul{ display: none;}
.umTabCon ul.on,.postArr .postList{ display:flex;flex-wrap: wrap;}

.artTabs{ padding: 70px 0 0;}
.artTabs .umTab li{ margin: 8px 0;}
.artPost .postArr ul,.widget.sbarhot ul,.postArr .postList{ font-size: 0;margin: 0 -30px;}
.artPost .postArr li,.widget.sbarhot li,.postArr .postList .post{width: 33.333%;flex: 0 0 33.333%;padding: 20px 30px;display: flex;flex-direction: column; overflow: hidden; }

.index .artPost .postArr ul{margin: 0 -15px;}
.index .artPost .postArr li{width: 50%;flex: 0 0 50%;padding: 15px;}
.index .artPost .postArr li .item{width: 100%;text-align: left;position: relative;display: -ms-flexbox;display: flex;-ms-flex-direction: column;flex-direction: column;min-width: 0;word-wrap: break-word;-ms-flex-direction: row;flex-direction: row; padding:15px; background-color: #f7f9ff;}
.index .artPost .postArr li .item .pic{width: 150px;position: relative;font-size: 0;-ms-flex-negative: 0;flex-shrink: 0;background:rgba(0,0,0,0);}
.index .artPost .postArr li .item .pic .img{-webkit-border-radius: 5px;border-radius: 5px;background: #fafafa;overflow: hidden;}
.index .artPost .postArr li .item .text{width: 100%;padding: 5px 20px 5px 100px;}
.index .artPost .postArr .item .title{ text-align: left;-webkit-line-clamp: 1;margin-bottom: 0;}
.index .artPost .postArr .item .pic a:after{ padding-top: 100%;}
.index .artPost .postArr .item .time{ position: absolute; padding: 0; text-align: center; position: absolute; top:23px; left: 20px;color: #282828;}
.index .artPost .postArr .item .time span{ font-size: 14px;}
.index .artPost .postArr .item .time .day{ font-size: 30px; display: block; line-height: 1.2; font-weight: bold;}
.index .warp .item .tag{font-size: 14px;background: transparent;box-shadow:none; position: static; padding: 0; color: #8965CF;line-height: 28px;}
.index .artPost .postArr .item .info{font-size: 14px; line-height: 1.7; margin-top: 10px;text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp: 3;-webkit-box-orient: vertical; overflow: hidden;opacity: 0.68;color: #282828;}

.postArr .postList{ margin-bottom: 20px;}
.postArr .postList .post{padding: 10px 30px 30px;}

.artPost .postArr .item,.widget.sbarhot li .item,.postArr .postList .post .item{background: #fff; padding-bottom: 100px; position: relative;height: 100%;overflow: hidden;border-radius: 5px;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;}
.artPost .postArr .item.simple,.widget.sbarhot li .item.simple,.postArr .postList .post .item.simple{padding-bottom: 50px;}
.warp .item .tag{position: absolute;top: 24px;left: 0;width: 100px;height: 38px;border-radius: 0 37px 37px 0;line-height: 38px;font-size: 15px;font-weight: 600;text-align: center;color: white;letter-spacing:0px;border: none;z-index: 1;background: linear-gradient(45deg, #ff31af, #fb53c1);box-shadow: 0px 0px 8px 0px #462d3c60;text-overflow: ellipsis;white-space: nowrap; overflow: hidden; padding: 0 5px;}

.warp .item .bg0{background: linear-gradient(45deg, #ff31af, #fb53c1);box-shadow: 0px 0px 8px 0px #462d3c60;}
.warp .item .bg1{background: linear-gradient(45deg, #ec845b, #f99d78);box-shadow: 0px 0px 8px 0px #57342660;}
.warp .item .bg2{background: linear-gradient(45deg, #855ad9, #a973f3);box-shadow: 0px 0px 8px 0px #2f263f60;}
.warp .item .bg3{background: linear-gradient(45deg, #4473e5, #6c95f8);box-shadow: 0px 0px 8px 0px #33384160;}
.warp .item .bg4{background: linear-gradient(45deg, #5bcca1, #88dabb);box-shadow: 0px 0px 8px 0px #27332e60;}
.warp .item .bg5{background: linear-gradient(45deg, #bc8502, #d0b000);box-shadow: 0px 0px 8px 0px #3d341f60;}
.warp .item .bg6{background: linear-gradient(45deg, #e208ab, #f76371);box-shadow: 0px 0px 8px 0px #3f153160;}
.warp .item .bg7{background: linear-gradient(45deg, #41d3e7, #30dd8d);box-shadow: 0px 0px 8px 0px #0d323760;}

.artPost .postArr .item:hover,.widget.sbarhot li .item:hover{transform: translateY(-5px);box-shadow: 0px 2px 10px 0px rgba(46, 31, 74, 0.2);}
.artPost .postArr .item .pic a{ position: relative; display: block; background-color: #fafafa;}
.artPost .postArr .item .pic a:after{ content: ''; display: block; padding-top: 75%;}
.artPost .postArr .item .pic a img{ position: absolute; width: 100%; height: 100%; object-fit: cover;}
.artPost .postArr .item .text{padding: 20px 20px 0px;}
.artPost .postArr .item .title{cursor: pointer;color: #282828;font-size:18px;font-weight: normal;justify-content: start;align-items: center;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;line-height: 1.6;}
.artPost .postArr .item .title a strong{color: #8965CF}
.artPost .postArr .item .time{font-size: 14px;color: #b3acc4;box-sizing: content-box;height: 20px;padding: 12px 0 0;}

.loading{background-image:url(images/lay.gif); background-repeat: no-repeat; background-position:center;background-size:20px auto;}
.warpBox .typeBox .item .pic.loading{ max-width: 80px;}

.warp .item .fex{ position: absolute; bottom: 15px; left: 20px; right: 20px;}
.warp .item .fot{display: flex;justify-content: space-between;align-items: center;height: 42px;padding-top: 12px; margin-top: 12px; position: relative;}
.warp .item .fot:after{content: "";position: absolute;width: 100%;top: 0;left: 0;height: 1px;background: #f2f1f8;}
.warp .item .fot img{width: 30px;height: 30px;border-radius: 100%;margin-right: 8px;vertical-align: middle; font-size: 0; background: #fafafa;display: inline-block;}
.warp .item .fot .user{ width: 120px; font-size: 14px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}
.warp .item .fot .tags{display: flex;justify-content: end;height: 25px;overflow: hidden;flex-wrap: wrap;}
.warp .item .fot .tags a{padding: 0 10px;box-sizing: content-box;height: 25px;font-size: 12px;line-height: 25px;text-align: center;background: #8965CF15;margin-left: 10px;border-radius: 2px;color: #8965CF;}
.warp .item .fot .tags a:first-of-type{ margin-left: 0;}

.artPost .postArr .noArr{ text-align: center; font-size: 0; padding: 100px 0 120px;color: #8965CF;background: #fff;border-radius: 5px; margin-bottom: 30px;}
.artPost .postArr .noArr i{font-size: 68px;margin-bottom: 10px;display: block;word-wrap: break-word !important;opacity: .2;}
.artPost .postArr .noArr p{ font-size: 18px;color: #8965CF;opacity: .4;}

.artPost .postArr li.more{width: 100%;flex: auto;}
.artPost .postArr li.more a{display: block;width: 172px;height: 46px;text-align: center;line-height: 42px;color: #523787;border: #523787 2px solid;border-radius: 46px;font-size: 16px;font-weight: 600;margin: 0 auto;}

.warpBox .listBox{background: linear-gradient(180deg, #8965CF29, #8965CF0F 60%);padding: 40px;}
.warpBox .listBox .listItem{display: flex; margin:-15px;flex-wrap: wrap;}
.warpBox .listBox .listItem .title{ position: relative; border-bottom: 1px solid #8965CF29; line-height: 30px; padding-bottom: 5px; margin-bottom:8px;}
.warpBox .listBox .listItem .title .more{ font-size: 14px; float: right; opacity: .4;color: #8965CF}
.warpBox .listBox .listItem .title h3{ font-size: 18px; font-weight: bold; background: none; display: inline-block; color: #8965CF;box-shadow:none;}

.warpBox .listBox .listItem .item{ width: calc(100% / 3 - 30px); margin:15px; display: inline-block; background: #fff; border-radius: 5px; min-height: 100px; padding: 15px;-ms-transition: .5s;-moz-transition: .5s;-webkit-transition: .5s;}
.warpBox .listBox .listItem .item:hover{box-shadow: 0px 2px 15px 0px rgba(46, 31, 74, 0.06); transform: translateY(-5px);}
.warpBox .listBox .listItem li{ height: 32px; line-height: 32px;text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;overflow: hidden; padding-left: 15px;position: relative; }
.warpBox .listBox .listItem li::before{content: "\e606";color: #8965CF;font-family: "simple-line-icons"; position: absolute; left: 0; font-size: 11px;}

/*人格分类*/
.cateBn{height: 320px;background: #fff;margin-top: 20px;border-radius: 5px; overflow: hidden; position: relative; color: #fff;}
.cateBn h3{ font-weight: 800;color: #fff;font-size: 40px; margin-top: -10px;}
.cateBn h3 span,.cateBn h3 b{font-weight:300;}
.cateBn.sort0,.subcate li.sort0.active a{background: #7D91EC}
.cateBn.sort1,.subcate li.sort1.active a{background: #B1B482}
.cateBn.sort2,.subcate li.sort2.active a{background: #E29171}
.cateBn.sort3,.subcate li.sort3.active a{background: #946EDF}

.cateBn .img{ height: 320px; font-size: 0;}
.cateBn .img img{ width: 100%; height: 100%;object-fit: cover;}
.cateBn .pic{position: absolute;height: 100%;right: 4%;top: 0px;}
.cateBn .pic img{height: 100%;vertical-align: middle;}
.cateBn .pic img.girl{transform: translate(-50px, 16px);}
.cateBn .text{ width: 100%; position: absolute; top: 50%; transform: translateY(-50%);left: 0px; padding: 40px 300px 40px 100px;}
.cateBn .text .des{font-size: 18px;font-weight: 500;text-align: left;color: #ffffff;line-height: 25px; margin-top: 10px;}
.cateBn .text .btn{display: inline-block; margin-top: 20px;}
.cateBn .text .btn a{background: #ea8f6b; color: #fff; font-weight: 600;font-size: 16px;}

.artBox{padding-right: 380px;position: relative;float: left;width: 100%;}
.artBox .post{ background: #fff; padding:24px 28px 20px 28px; margin-bottom: 25px; border-radius: 5px;}
.artBox .title{ position: relative;}
.artBox .title span.en{ width: 100%;display: inline-block;font-size: 12px;color: #36235C;line-height: 15px;}
.artBox .title:after{ content: ''; display: block; width: 100%; height: 1px; position: absolute; bottom:6px;left: 0;border-bottom: #F5F3F8 solid 1px;}
.artBox .title h4{position: relative;display: inline-block;z-index: 1;font-size: 24px;line-height: 36px;font-weight: 600;color: #282828;background: #fff; padding-right: 15px;}
.artBox .title h4:after{ content: '';position: absolute;width: 14px;height: 14px;background: #EBE8EF;bottom: 6px;right:10px;z-index: -1;}

.type .artBox .post{ width: 100%; display: inline-block;}
.type .artBox .post .des{padding: 22px 0 22px;font-size: 16px;line-height: 2;}
.type .artBox .post.letter .des{ padding: 10px 0;}
.type .artBox .post.letter ul{display: flex;flex-wrap: wrap;}
.type .artBox .post.letter li{width: 50%; margin:15px 0;}
.type .artBox .post.letter li .s1{font-size: 14px;font-weight: 700;color: #36235C;margin-right: 8px;}
.type .artBox .post.nature .des{ position: relative; width: 100%; margin-top: 25px; padding: 12px 0 10px 4%;}
.type .artBox .post.nature .des:last-of-type{ padding-bottom: 30px;}
.type .artBox .post.nature .des .bg{z-index: 0;position: absolute;width: 100%;height:auto;top: 0;left: 0;object-fit: cover;object-position: left;}
.type .artBox .post.nature .des ul{ background: #f9f7fb; position: relative; z-index: 1; padding:0px 20px;}
.type .artBox .post.nature .des li{padding: 20px 0;border-bottom: solid 1px #f1e8fa;}
.type .artBox .post.nature .des li:last-of-type{ border-bottom: none;}
.type .artBox .post.nature .des li h2,.type .artBox .post.nature .des li h3,.type .artBox .post.nature .des li h4{ font-size: 18px; margin-bottom: 12px;line-height:1.8;}
.type .artBox .post.nature .des li h2{ font-size: 20px;}
.type .artBox .post.nature .des li h4{ font-size: 16px;}
.type .artBox .post.nature .des p{font-size: 14px;line-height: 23px;font-weight: 400;}

.type .artBox .post.letter li .s2{ padding: 0 3px; display: inline-block;height: 18px;background:#ea8f6b;font-weight: 600;text-align: center;line-height: 18px;color: #fff;margin:0 8px;position: relative;font-size: 12px;vertical-align: middle;}
.type .artBox .post.letter li .s2:before,.type .artBox .post.letter li .s2:after{content: "";width: 0;height: 0;-webkit-transform: rotate(180deg);transform: rotate(180deg);position: absolute;}
.type .artBox .post.letter li .s2:before{margin-left: 35px; border-bottom:18px solid #ea8f6b;border-left: 5px solid transparent;right: -5px;}
.type .artBox .post.letter li .s2:after{margin-right: 35px;border-top: 18px solid #ea8f6b;border-right: 5px solid transparent;left:-5px;}
.type .artBox .post.letter li .s3{font-size: 14px;font-weight: 400;}

.type .artBox .post.famous .des{ padding-bottom: 10px;}
.type .artBox .post.famous .des ul{display: flex;flex-wrap: wrap;justify-content: space-between;text-align: center;}
.type .artBox .post.famous .des li{ width: calc(100% / 4 - 20px); display:inline-block; vertical-align: top; margin: 10px 0;}
.type .artBox .post.famous .des li span{position: relative;display: block; background: #ebe8ef;}
.type .artBox .post.famous .des li span:after{ content: ''; padding-top: 135%; display: block;}
.type .artBox .post.famous .des li span img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; display: block;}
.type .artBox .post.famous .des li p{ font-size: 15px; margin-top: 10px;}

.type .artBox .fotBtn{ width: 100%;height: 56px;display: inline-block;margin:20px 0 40px;display: flex;align-items: center;justify-content: center;}
.type .artBox .fotBtn a{height: 56px; line-height: 56px; min-width: 225px; padding: 0 10px; border-radius: 40px;background: linear-gradient(180deg, #936edd, #704cb6);color: #ffffff;}



/*适应*/
@media screen and (max-width:1336px){
.category .warpBox .typeBox li h4,.category .warpBox .typeBox li h4 span{ font-size: 18px;}
.category .warpBox .typeBox li span{ margin-top: 8px;}
}

@media screen and (max-width:1200px){
.header .logo{height: 58px;}
.category .warpBox .typeBox li{ height: 360px;}
.category .warpBox .typeBox li h4,.category .warpBox .typeBox li h4 span{ font-size: 16px;}
.category .warpBox .typeBox li span{ margin-top:6px; font-size: 14px;}
.artPost .postArr ul, .widget.sbarhot ul, .postArr .postList{margin: 0 -20px;}
.postArr .postList {margin-bottom: 20px;}
.artPost .postArr li, .widget.sbarhot li, .postArr .postList .post{padding:20px;}
.category .warpBox .typeBox li .item{ padding: 0 150px;}
.artBox{padding-right: 340px;}
.sidebar{width: 316px;float: right;margin-left: -316px;}
.type .artBox .post.famous .des li{width: calc(100% / 4 - 15px);}
.subcate{height: auto;padding: 6px 0;}
.subcate .container {padding: 0;}
.subcate li{margin: 3px;}
.subcate li a{padding: 0 10px;height: 36px;line-height: 36px;font-size: 15px;background: rgba(255,255,255,0.5);border-radius: 3px;}
.index .warpBox .typeBox{margin:20px -15px;}
.index .warpBox .typeBox li{flex: 0 0 auto; width: calc(100% / 2 - 30px); margin: 15px;}
.artPost .postArr .item .title{font-size: 16px;}
.index .artPost .postArr .item .info{-webkit-line-clamp: 2;}
.index .artPost .postArr li .item .pic{ width: 118px;}
.index .artPost .postArr li .item .text{padding: 5px 20px 5px 90px;}
.indexText li{ padding-left: 30px;}
.indexText li:last-of-type{ padding-left: 0; padding-right: 30px;}
}

@media screen and (max-width:992px){
.header .logo{height: 50px;}
.header .navBar{ display: none;}
.header .headRight button.navBtn{ display: block;}
.header .headSearch{display: none;}
.category .warpBox .typeBox li{width: 100%;}
.category .warpBox .typeBox li h3{ text-align: center; margin: 0;}
.warpBox .data li .item .nums{font-size: 28px;}
.artPost .postArr ul, .widget.sbarhot ul, .postArr .postList{margin: 0 -15px;}
.postArr .postList {margin-bottom: 20px;}
.artPost .postArr li, .widget.sbarhot li, .postArr .postList .post{padding:15px;}
.artPost .postArr .item .title{ font-size: 18px;}
.category .warpBox .typeBox li .item{ padding: 0 120px;}
.cateBn .text{padding: 40px 300px 40px 60px;}
.cateBn .pic{right: 0;}
.warpBox .listBox .listItem{margin: -10px;}
.warpBox .listBox .listItem .item{width: calc(100% / 3 - 20px);margin: 10px;}
.index .warpBox .typeBox li h4,.index .warpBox .typeBox li h4 span{ font-size: 15px;}
.index .warpBox .typeBox li span{ font-size: 12px;}
.index .warpBox .typeBox{margin:20px -10px;}
.index .warpBox .typeBox li{flex: 0 0 auto; width: calc(100% / 2 - 20px); margin: 10px;}
.index .artPost .postArr li{width: 100%;flex: 0 0 100%;padding: 10px 15px;}
.index .warp .item .tag{ font-size: 12px;}
.index .artPost .postArr .item .info{margin-top: 3px;}
.artPost .title a.more{ top: 16px;}
.type .artBox .fotBtn,.type .artBox .fotBtn a{height: 50px;line-height: 50px;font-size: 16px;}
}

@media screen and (max-width:900px){
.artPost .postArr ul, .widget.sbarhot ul, .postArr .postList{margin: 0 -10px;}
.postArr .postList {margin-bottom: 20px;}
.artPost .postArr li, .widget.sbarhot li, .postArr .postList .post{padding:10px;}
.umTabBox{ margin-bottom: 20px;}
.umTab li span{ font-size: 18px;}
.artPost .postArr .item .title{ font-size: 16px;}
.category .warpBox .typeBox li .item{ padding: 0 80px;}
.cateBn,.cateBn .img{ height: 280px;}
.cateBn .text{padding: 30px 260px 30px 60px;}
.cateBn .pic img.male{transform: translate(20px, 0px);}
.cateBn .pic img.girl{transform: translate(-30px, 16px);}
.cateBn h3{ font-size: 32px;}
.cateBn .text .des{ font-size: 16px;}
.artBox {padding-right: 0;}
.sidebar{width: 100%;float: nones;margin-left: 0;}
.widget.sbarhot ul{display: flex; flex-wrap: wrap;}
.widget.sbarhot li{width: 50%;flex: 0 0 50%;}
.warpBox .listBox .listItem .item{width: calc(100% / 2 - 20px);}
.typeTest .testBanner .bnText .text h2,.typeTest .testBanner .bnText .text h3,.typeTest .testBanner .bnText .text h4{ font-size: 28px;color: #fff; margin-bottom: 5px; padding-top: 20px;}
.typeTest .testBanner .bnText .text h3,.typeTest .mod.not .notBox .title h2{ font-size: 24px;}
.typeTest .testBanner .bnText .text h4{ font-size: 20px;}
.typeTest .warpBox .mod{ padding: 60px 0 0;}
.typeTest .warpBox .mod .title h2{ font-size: 26px;}
.typeTest .warpBox .mod.card2 li .tit,.typeTest .testBanner .bnTips .text:before{ font-size: 20px;}
.typeTest .warpBox .mod.card2 li,.typeTest .warpBox .mod.card2 li .txt h3,.typeTest .warpBox .mod.card1 li,.typeTest .warpBox .mod .intro,.typeTest .testArt li .txt,.typeTest .testArt li,.typeTest .testBanner .bnText .text,.typeTest .testBanner .bnTips .text{ font-size: 16px;}
.typeTest .warpBox .mod .title{ margin-bottom: 25px;}
.index .warpBox .typeBox{margin: 20px 18px 10px -10px;}
.index .warpBox .typeBox li{flex: 0 0 auto; width: 100%;}
.index .warpBox .typeBox li h3{font-size: 26px; text-align: center;margin-left: 0;}
.artPost .title h3{ font-size: 30px;}
.artPost .title .entit{font-size: 76px;margin-top: -72px;}
.warpBox .data li .item{ font-size: 14px; padding-left: 36px;}
.warpBox .data li .item .nums{font-size: 24px;}
.warpBox .data li .item i{font-size: 28px;}
.artPost .title a.more{ top: 10px;}
.warpBox .slogan .img .btn{width: 160px;height: 44px;line-height: 44px; top: 29%;}
}

@media screen and (max-width:750px){
.header{ padding: 5px 0;}
.header .headRight button.navBtn{top: 50%; margin-top: -14px;}
.header .logo{ margin: 0 auto;}
.warpBox .data li .item{font-size: 14px;}
.warpBox .data li .item .nums{font-size: 20px;}
.footer .footLogo img{ max-width: 90%;}
.artPost .postArr .item .title{ font-size: 14px;}
.artPost .postArr .item .time{ font-size: 12px;}
.artPost .postArr li, .widget.sbarhot li, .postArr .postList .post{width: 50%;flex: 0 0 50%;}
.footer .footText ul li h3, .footer .footQrcode h3{ font-size: 16px;}
.footer .footText ul li{font-size: 12px;margin-right: 30px;}
.footer .footQrcode{ padding: ;-left: 20px;}
.category .warpBox .typeBox li .item{ padding: 0 20px;}
.btn,.artPost .postArr li.more a{width: 148px;height: 40px;line-height: 40px;font-size: 14px;}
.type .artBox .fotBtn,.type .artBox .fotBtn a{height: 46px;line-height: 46px;font-size: 14px;}
.cateBn,.cateBn .img{ height: 240px;}
.cateBn h3{ font-size: 26px;margin-top: -5px;}
.cateBn .text {padding: 20px 220px 20px 60px;}
.cateBn .text .des{ font-size: 14px;}

.subcate{ height: auto; padding:6px 0;}
.subcate .container{ padding: 0;}
.subcate .subItemBox{overflow-x: scroll;display: flex;align-items: center;}
.subcate ul{display: flex;justify-content: center;align-items: center;}
.subcate li{white-space:nowrap;}
.subcate li a{font-size:14px;}
.typeTest .warpBox .mod .title h2{ font-size: 24px;}
.typeTest .testBanner .bnText .text{ max-width: 80%; bottom: 50px;}
.typeTest .testBanner .bnTips{height: 38px;line-height: 38px;}
.typeTest .testBanner .bnTips .text:before{ font-size: 18px;}
.typeTest .testBanner .bnTips .text{ font-size: 14px;}
.typeTest .warpBox .mod.card2 ul{grid-template-columns: repeat(2, minmax(0, 1fr));}
.typeTest .mod.not .notBox ul{padding: 40px;}
.typeTest .warpBox .mod.card2 li .txt{ text-align: center;}
.index .warpBox .typeBox li h3{font-size: 24px;}
.umTabBox{padding: 10px 10px 10px 10px;}
.umTabSc{ display: none;}
.umTab{justify-content: center;padding-right: 0;}
.index .artPost .postArr li .item .pic{ width: 110px;}
.artPost .title a.more{ top: 5px;}
.warpBox .img img.pc{ display: none;}
.warpBox .img img.mob{ display: block;}
}

@media screen and (max-width:640px){
.footer .footLink{ width: 100%; padding: 30px 0 0;}
.umTabBox{ margin-bottom: 10px;}
.umTab li span{ font-size: 16px;}
.artPost .postArr li, .widget.sbarhot li, .postArr .postList .post{width: 100%;flex: 0 0 100%;}
.cateBn,.cateBn .img{ height: 200px;}
.cateBn h3{ font-size: 22px;margin-top: 0px;}
.cateBn .text {padding: 10px 180px 10px 40px;}
.cateBn .text .btn a{ font-size: 14px;}
.footer .footWrap{ display: inline-block; width: 100%;}
.footer .footText ul li h3, .footer .footQrcode h3{ font-size: 14px;}
.footer .footText.callon ul{ display: inline-block; width: 100%;margin-bottom: 0;}
.footer .footText.callon ul li{ width: 100%;margin-right: 30px; margin-bottom: 20px;}
.footer .footText.callon ul.footLink li.tit{width: 100%; max-width: none;}
.footer .footText.callon ul.footLink li{ width: auto;margin-bottom: 0;}
.footer .footText ul li.call span{ margin-right:0px;}
.footer .footQrcode{ display: none;}
.footer .footText ul li:last-of-type{margin-right: 0;}
.footer .footText ul.footLink{ padding-top: 10px;}
.type .artBox .post.famous .des li {width: calc(100% / 2 - 12px);}
.warpBox .listBox .listItem .item{width: calc(100% / 1 - 20px);}

.typeTest .testBanner .bnText .text{ max-width: 95%; bottom: 50px; font-size: 14px;}
.typeTest .testBanner .bnText .text h2{font-size: 24px;}
.typeTest .testBanner .bnText .text h2::before, .typeTest .testBanner .bnText .text h3::before, .typeTest .testBanner .bnText .text h4::before {width: 20px;height: 8px;}

.typeTest .warpBox .mod{padding: 50px 0 0;}
.typeTest .warpBox .mod.card1 ul,
.typeTest .warpBox .mod.card2 ul{grid-template-columns: repeat(1, minmax(0, 1fr));gap: 20px;}
.typeTest .warpBox .mod.card2 li .txt p:first-of-type{ min-height: auto;}
.typeTest .warpBox .mod.card2 li, .typeTest .warpBox .mod.card2 li .txt h3, .typeTest .warpBox .mod.card1 li, .typeTest .warpBox .mod .intro, .typeTest .testArt li .txt, .typeTest .testArt li, .typeTest .testBanner .bnText .text, .typeTest .testBanner .bnTips .text{ font-size: 14px;}
.typeTest .testArt li .txt,.typeTest .testArt li .text{ padding-left: 20px;}
.typeTest .testArt.right li .txt{padding-right: 20px;}
.typeTest .mod.not .notBox ul{padding: 30px;}
.typeTest .warpBox .mod .title{ margin-bottom: 20px;}
.typeTest .mod.not .notBox .title h2,.typeTest .warpBox .mod .title h2{ font-size: 20px;}
.typeTest .mod.not .notBox li{ font-size: 16px;}
.index .warpBox .typeBox li h4,.index .warpBox .typeBox li h4 span{ font-size: 12px;}
.index .warpBox .typeBox li span{ font-size: 12px;}
.artPost .title h3{ font-size: 26px;}
.artPost .title .entit{font-size: 60px;margin-top: -57px;}
.index .artPost .title{margin-bottom: 25px;}
.indexText{padding: 0;}
.indexText .container{ padding: 0;}
.indexText:after{ display: none;}
.indexText ul{margin-right:0px;display: block;}
.indexText li{margin-right:0px;width: 100%;padding:28px 30px;}
.indexText li:last-of-type {padding-left: 30px; padding-right: 30px; background-color: #f1f6ff;border-top: 2px solid #fff;}
.warpBox .data{ padding: 16px 0;}
.warpBox .data li .item{ font-size: 12px; padding-left:0px;text-align: center;}
.warpBox .data li .item .nums{font-size: 20px;}
.warpBox .data li .item i{font-size: 24px; position: static;}
.warpBox .slogan .img .btn{width: 128px;top: 29%;height: 36px;line-height: 36px;}
.warpBox .data .container{padding: 0;}
.artPost.artTabs .umTab a.more{ top: -62px;}
}

@media screen and (max-width:580px){
.warpBox .data li .item{font-size: 12px;}
.warpBox .data li .item .nums{font-size: 18px;}
.category .warpBox .typeBox .item .pic img{ height: 148px;}
.category .warpBox .typeBox li h3{ font-size: 30px;}
.category .warpBox .typeBox li{ height: 320px;}
.category .warpBox .typeBox li:after{ margin-top: 180px;}
.category .warpBox .typeBox li h4{ margin-top: 16px;}
.category .warpBox .typeBox li h4,.category .warpBox .typeBox li h4 span{ font-size: 14px;}
.category .warpBox .typeBox li span{ font-size: 12px;}
.category .warpBox .typeBox li .item{ padding: 0px;}
.btn,.artPost .postArr li.more a{width: 110px;height: 36px;line-height: 36px;}
.artPost .postArr li.more a{ line-height: 34px;}
.cateBn h3 {font-size:18px; margin-top: 0px;}
.cateBn .text{padding: 10px 160px 10px 20px;}
.cateBn .text .des{ font-size: 12px; margin-top: 5px;}
.cateBn .text .btn{margin-top: 10px;}
.cateBn .pic img.male {transform: translate(30px, 0px);}
.cateBn .pic img.girl {transform: translate(-20px, 16px);}
.type .artBox .post.letter .des{ padding-top:20px;}
.type .artBox .post.letter li{ width: 100%; margin: 5px 0;}
.single .postTitle{ font-size: 20px;}
.single .artPost{padding: 15px 20px;}
.widget{padding: 20px 20px 20px;}

.typeTest .testBanner .bnText .text{ max-width:none; right: 15px; bottom: 36px; font-size: 13px; line-height: 1.6;}
.typeTest .testBanner .bnText .text h2::before, .typeTest .testBanner .bnText .text h3::before, .typeTest .testBanner .bnText .text h4::before {display: none;}
.typeTest .testBanner .bnText .text h2{font-size: 18px;}
.typeTest .testBanner .bnTips{height: 32px;line-height: 32px;}
.typeTest .testBanner .bnTips .text:before{ font-size: 14px;}
.typeTest .testBanner .bnTips .text{ font-size: 12px;}
.typeTest .testArt li {flex-wrap: wrap;margin-bottom: 30px;}
.typeTest .testArt li .pic,.typeTest .testArt.art li .thumb{ width: 100%;}
.typeTest .warpBox .mod .testArt.art .title{ font-size: 18px; margin-bottom: 10px;}
.typeTest .testArt li .pic a::after{ padding-top: 75%;}
.typeTest .testArt li .txt,.typeTest .testArt li .text,
.typeTest .testArt.right li .txt{ padding:15px 0 0 0;}
.typeTest.category .warpBox .btn{height: 50px;line-height: 50px;}
.index .artPost .postArr .item .info{ font-size: 12px;}
.index .artPost .postArr li .item .pic{width: 104px;}
.indexText li h3{ font-size: 16px;}
.indexText li{font-size: 13px;}
.warpBox .data li .item i{font-size: 22px;}
.footer .footText .footUl li,.footer .footText ul.footLink li{ margin-right: 15px;}
}

@media screen and (max-width:480px){
.header .headSearch .form{ width: 130px;}
.category .warpBox .typeBox li{ height: 280px;}
.category .warpBox .typeBox li:after{ margin-top: 155px;}
.category .warpBox .typeBox li span{ margin-top:2px;}
.category .warpBox .typeBox li h4,.category .warpBox .typeBox li h4 span{ font-size: 12px;}
.warpBox .data li .item{font-size: 12px;}
.warpBox .data li .item .nums{font-size: 14px;}
.category .warpBox .typeBox .item .pic img{ height: 118px;}
.warpBox .data li .item p{transform: scale(.8);}
.cateBn .text{padding: 10px 140px 10px 20px;}
.cateBn .pic img.male {transform: translate(40px, 0px);}
.cateBn .pic img.girl {transform: translate(-10px, 16px);}
.artBox .title span.en{ font-size: 11px;}
.artBox .title h4{font-size: 20px;line-height: 30px;}
.type .artBox .post .des,.typeTest .mod.not .notBox li{ font-size: 14px;}
.warpBox .listBox{padding: 30px 25px;}
.warpBox .listBox .listItem li{ font-size: 12px;height: 30px;line-height: 30px;}
.warpBox .listBox .listItem li:before{ font-size: 10px;}
.typeTest .mod.not .notBox .title h2,.typeTest .warpBox .mod .title h2{ font-size: 18px;}
.typeTest .warpBox .mod .testArt.art .title{ font-size: 16px; margin-bottom: 5px;}
.typeTest .testArt li{ margin-bottom: 20px;}
.typeTest .warpBox .mod:last-of-type{ padding-bottom: 50px;}
.index .warpBox .typeBox .item .pic,.index .warpBox .typeBox .item .pic img{ width: 68px; height: 68px;}
.index .warpBox .typeBox li{padding: 20px 0px;}
.index .warpBox .typeBox li .item{ margin-top: 20px;}
.index .warpBox .typeBox li h4{margin-top: 10px;}
.umTab li span{ font-size: 14px;padding: 0 8px;height: 32px;line-height: 32px;}
.artTabs{ padding: 60px 0 0;}
.artPost .title h3{ font-size: 22px;}
.artPost .title .entit{font-size: 50px;margin-top: -48px;}
.index .artPost .postArr .item .info{ display: none;}
.index .artPost .postArr .item .title{-webkit-line-clamp: 2;}
.index .artPost .postArr li .item .pic{width: 82px;}
.index .artPost .postArr .item .time{top: 21px;}
.index .artPost .postArr .item .time .day{font-size: 24px;}
.indexText li{ font-size: 12px;}
.indexText li h3{ font-size: 14px;}
.footer{padding: 25px 0 0;}
.footer .footText .footUl{display: block;}
.footer .footText .footUl ul:first-of-type{max-width: 100%;}
.footer .footText .footUl ul:last-of-type{ margin-top: 20px;}
.footer .footText .footUl ul{margin-right: 0px;width: 100%;max-width: 100%;}
.footer .footText .footUl li{ font-size: 12px; margin-right: 10px;}
.footer .footText ul.footLink{margin-top: 0px;padding: 20px 0 0;}
.artPost .title a.more{ top:4px;padding-bottom: 5px;font-size: 12px;}
.artPost .title a.more:before{ height: 2px;}
.artTabs .umTab li{margin: 4px 0;}
.warpBox .data{ padding: 10px 0;}
.index .artPost .postArr li .item .text{padding: 5px 15px 5px 80px;}
.footer .footText ul.footLink li{ margin-right: 10px;}
.artPost.artTabs .umTab a.more{font-size: 12px;top: -53px;padding-bottom: 5px}
.artPost.artTabs .umTab a.more:before{ height: 2px;}
}