@charset "UTF-8";

html, body {
    background: #f5f6ff;
}

html {
    overflow-x: hidden;
}

.footer {
    margin-top: 0;
}

.banner {
    position: relative;
    z-index: 1;
}

.banner:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: url(/images/head-zzt.png) repeat-x;
    background-position: center top;
    z-index: 2;
}

.banner img {
    display: block;
    width: 100%;
}

.pagination {
    text-align: center;
    font-size: 0;
    padding-top: 0.5rem;
}

.pagination a {
    display: inline-block;
    border: 1px solid #dcdcdc;
    padding: 0 0.12rem;
    height: 0.35rem;
    font-size: 0.14rem;
    line-height: 0.35rem;
    text-align: center;
    color: #666;
    margin: 0 0.07rem;
}

.pagination a.active {
    background: #1d2088;
    color: #fff;
    border: 1px solid #1d2088;
}

.pagination a:hover {
    background: #1d2088;
    color: #fff;
    border: 1px solid #1d2088;
}

.pagination span {
    display: inline-block;
    font-size: 0.14rem;
}

#nymain {}

.nymain {
    position: relative;
    z-index: 3;

}

.nymain>div {
    display: flex;
}

.nymain::before {}

.nymain .leftNav {
    float: left;
    width: 2.92rem;
    position: relative;
    margin-right: .5rem;
    /* background: #fff; */
    margin-top: -1.26rem;
    display: none;
}

.nymain .leftNav>h2 {
    line-height: 1.26rem;
    color: #fffafc;
    font-size: .36rem;
    text-align: center;
    background: #1d2088;
    position: relative;
}





.nymain .leftNav>h2 img {
    vertical-align: middle;
    margin-right: 0.1rem;
    margin-top: -0.05rem;
}

.nymain .leftNav p {
    margin-left: 0.2rem;
    font-size: 0.26rem;
    font-weight: 600;
    color: #fff;
    padding: 0.2rem 0;
}

.nymain .leftNav>ul {
    background-position: right bottom;
    position: relative;
    background: #F1F6F9;
    padding: 0.1rem .3rem .3rem .3rem;
}

.nymain .leftNav>ul::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0.2rem;
    bottom: 0.7rem;
    top: 0;
    /* background: #fff; */
}

.nymain .leftNav>ul>li {
    position: relative;
}

.nymain .leftNav>ul>li:first-child {
    border-top: none;
}

.nymain .leftNav ul li a {
    display: block;
    font-size: .2rem;
    padding-left: 0.3rem;
    line-height: .6rem;
    border-bottom: 1px dashed rgba(0, 96, 175, .2);
    color: #4D4D4D;
}




.nymain .leftNav>ul>li.on>a {
    color: #1d2088;
    font-weight: 600;
}



.nymain .leftNav>ul>li.activ {
    background: #dadada;
}

.nymain .leftNav>ul>li.active>a {
    color: #1d2088;
    font-weight: 600;
}


.nymain .leftNav ul li.active ul {
    display: block;
}

.nymain .leftNav ul li a:hover {
    background-position: 0.31rem center;
    color: #1d2088;
}

.nymain .leftNav>ul>li>ul {
    display: none;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
    border-bottom: 1px dashed rgba(0, 96, 175, .2);
}

.nymain .leftNav>ul>li>ul>li>a {
    font-size: 0.16rem;
    line-height: 0.46rem;
    /* border-top: 1px solid #eeeeee; */
    /* padding-left: 65px; */
    color: #666666;
    border: none;
}

.nymain .leftNav>ul>li>ul>li:nth-child(1)>a {
    border: none;
}

.ny-right {
    flex: 1;
    min-width: 0;
}

.ny-rcom {
    font-size: 0.24rem;
    color: #1d2088;
    margin-bottom: 0.15rem;
    font-weight: normal;
}

.position {
    margin-top: -2.5rem;
    position: relative;
    height: 2.5rem;
}

.position::before {}

.position>div {
    position: relative;
    text-align: right;
    font-size: 0;
    line-height: .4rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.position>h3 img {
    display: block;
    margin-right: 0;
    margin-left: .2rem;
}

.position h3 {
    font-size: .48rem;
    line-height: .8rem;
    color: #fff;
    font-weight: 600;
    z-index: 9;
    position: relative;
    display: flex;
    align-items: center;
    font-family: "sysong";
}

.position svg {
    margin-right: .1rem;
}

.position svg path {
    fill: rgba(255, 255, 255, .7);
}

.position span {
    color: #fffefe;
    font-size: .16rem;
    vertical-align: middle;
    z-index: 9;
    position: relative;
}

.position img {
    height: 0.16rem;
    vertical-align: middle;
    margin-right: 0.05rem;
    z-index: 9;
    position: relative;
}

.position a {
    font-size: .16rem;
    padding: 0 .1rem;
    vertical-align: middle;
    color: #fffefe;
    z-index: 9;
    position: relative;
}

.position a:hover {
    color: #fff;
}

.pcleftnav {
    position: relative;
    z-index: 99;
}

.pcleftnav::before {
    content: "";
    position: absolute;
    left: -999rem;
    right: -999rem;
    top: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 0 20px 20px rgba(0, 0, 0, .05);
}

.pcleftnav>ul {
    display: flex;
    flex-wrap: wrap;
}

.pcleftnav>ul>li {
    position: relative;
}

.pcleftnav>ul>li>a {
    display: block;
    font-family: "sysong";
    line-height: .8rem;
    font-size: 0.2rem;
    color: #000;
    padding: 0 .3rem;
    font-weight: 600;
}

.pcleftnav>ul>li:hover>a {
    color: #1d2088;
}

.pcleftnav>ul>li.active>a {
    color: #fff;
    background: #1d2088;
}


.pcleftnav>ul>li>div {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) scaleY(0);
    transform-origin: center top;
    transition: all 0.3s;
    right: 0;
    top: 100%;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    border-radius: 5px;
    padding: 10px;
    width: 160px;
    z-index: 999;
}

.pcleftnav>ul>li:hover div {
    transform: translateX(-50%) scaleY(1);
}

.pcleftnav>ul>li>div a {
    text-align: center;
    display: block;
    font-size: .16rem;
    line-height: .42rem;
    transition: all 0.3s;
    border-radius: 5px;
    font-family: "sysong";
    color: #555555;
}

.pcleftnav>ul>li>div a:hover {
    background: #1d2088;
    color: #fff;
}


.ny-rmain {
    padding-top: 1rem;
    padding-bottom: 1rem;
}


/* 内容页 */
.art-main {
    /* background: #FFFFFF; */
    /* border-top: .04rem solid #2A5798; */
    /* padding: .5rem .5rem .6rem 1.2rem; */
    position: relative;
}

.art-tit h3 {
    font-size: 0.3rem;
    font-weight: bold;
    line-height: 0.5rem;
    text-align: center;
    color: #333333;
}

.art-tit p {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: .1rem;
}

.art-tit p span {
    font-size: 0.16rem;
    font-weight: normal;
    line-height: 0.4rem;
    text-align: center;
    color: #888888;
    display: block;
}

.art-body {
    border-top: 1px dashed #BFBFBF;
    margin-top: .4rem;
    padding-top: 0.2rem;
}

.art-body p {
    font-size: 0.18rem;
    font-weight: normal;
    line-height: 0.34rem;
    color: #333333;
    margin-top: .3rem;
}

.art-body p img {
    display: block;
    max-width: 100%;
    margin: 0 auto;
}

.art-info {
    display: flex;
    justify-content: space-between;
    margin-top: .88rem;
}

.art-info>div {
    width: 48%;
    padding: .25rem .3rem;
    border: 1px solid #DFDFDF;
    border-top: 2px solid #2A5798;
    transition: all 0.3s;
}

.art-info>div p {
    font-size: 0.16rem;
    font-weight: normal;
    line-height: 0.24rem;
    color: #808080;
}

.art-info>div p a {
    display: block;
    color: #333333;
}

.art-info>div:hover {
    background-color: #2A5798;
    border-color: #2A5798;
}

.art-info>div:hover p {
    color: rgba(255, 255, 255, .7);
}

.art-info>div:hover p a {
    color: #fff;
}

.art-fx {
    position: absolute;
    left: .2rem;
    top: 2.2trm;
}

.visits>.art-fxicon {
    background: #2A5798;
    margin: 0 auto;
    width: 0.5rem;
    height: 0.5rem;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.visits>p {
    font-family: Arial;
    font-size: 0.16rem;
    font-weight: normal;
    line-height: 0.4rem;
    color: #888888;
    text-align: center;
}

.nyshare {
    position: relative;
}

.nyshare>.art-fxicon {
    background: #1d2088;
    margin: 0 auto;
    width: 0.5rem;
    height: 0.5rem;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

.nyshare>p {
    text-align: center;
    font-family: Arial;
    font-size: 0.16rem;
    font-weight: normal;
    line-height: 0.4rem;
    color: #1d2088;
}

#share-2 {
    position: absolute;
    left: .25rem;
    top: 0;
    height: 0.5rem;
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #1d2088;
    border-radius: 0 .3rem .3rem 0;
    padding: 0 .1rem 0 .35rem;
    z-index: 1;
    transform: scaleX(0);
    transform-origin: left center;
    transition: all 0.3s;
}

.nyshare:hover #share-2 {
    transform: scaleX(1);
}





.tit {
    position: relative;
    padding: .05rem 0;
    margin-bottom: .2rem;
    border-bottom: 2px dashed #a11a28;
    padding-bottom: .15rem;
}

.tit h2 {
    font-size: 0.24rem;
    font-weight: 600;
    line-height: .3rem;
    color: #1d2088;
}

.tit div {
    height: 1px;
    background-color: #a21a28;
    margin: .04rem 0;
}

.tit p {
    font-size: 0.12rem;
    line-height: .12rem;
    color: #1d2088;
}

.titmore div {
    margin-right: .25rem;
}

.titmore a {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(/images/tit-more.png) no-repeat;
    background-position: right center;
    background-size: auto .3rem;
    font-size: 0.16rem;
    font-weight: normal;
    line-height: .3rem;
    color: rgba(0, 0, 0, .6);
    padding-right: .3rem;
    padding-bottom: .05rem;
}

.titmore a:hover {
    color: #1d2088;
}

/* 公共服务 */
.pubserve {
    position: relative;
}

.pubserve-list::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    background: url(/images/ny-xh.png) no-repeat;
    background-position: center center;
    background-size: 4.3rem;
    width: 4.3rem;
    height: 4.3rem;
}

.pubserve-list ul {
    display: flex;
    flex-wrap: wrap;
}

.pubserve-list ul li {
    width: 33.33%;
}

.pubserve-list ul li a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.18rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.6rem;
    color: #010000;
    padding: 0 .1rem;
}

.pubserve-list ul li a:hover {
    color: #1d2088;
}


/* 机构设置 */

.jgsz {
   /* background: url(/images/jgsz-bg.png) no-repeat;
    background-position: center center;  */
}

.jgsz-box {
    margin-top: .5rem;
}

.jgsz-box:nth-child(1) {
    margin-top: 0;
}

.jgsz-list {
    margin-top: .2rem;
}

.jgsz-list ul {
    display: flex;
    flex-wrap: wrap;
}

.jgsz-list ul li {
    width: 33.33%;
}

.jgsz-list ul li a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.18rem;
    font-stretch: normal;
    line-height: 0.6rem;
    color: #010000;
}

.jgsz-list ul li a:hover {
    color: #1d2088;
    text-decoration: underline;
}


/* 博奥体育,中超足球联赛领导 */
.leader ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.leader ul li {
    width: 48%;
    margin-top: 1.9rem;
}

.leader ul li:nth-child(-n+2) {
    margin-top: 0;
}


.leader ul li a {
    display: flex;
    align-items: flex-end;
}

.leader ul li a .pics {
    width: 3.45rem;
    padding-right: .1rem;
    padding-bottom: .1rem;
    position: relative;
}

.leader ul li a .pics::before {
    content: "";
    position: absolute;
    left: .1rem;
    right: 0;
    bottom: 0;
    top: .6rem;
    border: dashed 0.02rem #1d2088;
    transition: all 0.5s;
}

.leader ul li a:hover .pics::before {
    border-style: solid;
    background: #1d2088;
}

.leader ul li a .pics .pic {
    padding-top: 133%;
}

.leader ul li a .info {
    flex: 1;
    min-width: 0;
    padding-left: .3rem;
}

.leader ul li a .info h3 {
    position: relative;
    font-size: 0.16rem;
    line-height: 0.26rem;
    letter-spacing: 0.01rem;
    color: #000000;
    font-weight: normal;
}

.leader ul li a .info h3::before {
    content: "";
    position: absolute;
    width: 0.53rem;
    right: 100%;
    top: 50%;
    height: 1px;
    background: #000000;
}

.leader ul li a .info p {
    font-size: 0.2rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.3rem;
    letter-spacing: 0.02rem;
    color: #000000;
    margin-top: .1rem;
    margin-bottom: .2rem;
}


/* 本科生教育综合页 */

.comp {
    padding-bottom: .5rem;
   /* background: url(/images/jgsz-bg.png) no-repeat;
    background-position: center bottom;  */
}

.comp .tit {
    display: flex;
    padding: .1rem 0;
}

.comp .tit h2 {
    background: url(/images/tit-bg.png) no-repeat;
    background-position: center center;
    background-size: auto 100%;
    line-height: .36rem;
}

.comp1-jz {
    display: flex;
    justify-content: center;
}

.comp1-c {
    background: rgba(29, 32, 136, .15);
    display: flex;
    justify-content: space-between;
    padding-top: .2rem;
}

.comp1-l {
    width: 6.1rem;
}

.comp1-l ul li a {
    display: block;
    position: relative;
}

.comp1-l ul li a .pic {
    padding-top: 58%;
}

.comp1-l ul li a .info {
    position: absolute;
    z-index: 9;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .6);
    padding: .1rem .2rem;
}

.comp1-l ul li a .info p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .16rem;
    line-height: .26rem;
    color: #fff;
    margin-right: 1.3rem;
}

.comp1-l .slick-dots {
    right: 0.1rem;
    bottom: 0.18rem;
    width: auto;
    font-size: 0;
}

.comp1-l .slick-dots li {
    background: #fff;
    width: 0.1rem;
    height: 0.1rem;
}

.comp1-l .slick-dots li.slick-active {
    background: #a21a28;
}

.comp1-r {
    flex: 1;
    min-width: 0;
    padding: 0 .2rem;
}

.comp1-r .tit {
    display: flex;
    align-items: center;
}

.comp1-r .tit h2.noon {
    font-size: .18rem;
    color: #000;
    background: none;
    font-weight: normal;
}

.comp1-r .tit h2:nth-child(1) {
    margin-right: .2rem;
}

.comp1-r .tit a {
    display: none;
}

.comp1-r .tit a.on {
    display: block;
}

.comp1-rbody div {
    display: none;
}

.comp1-rbody div.on {
    display: block;
}

.comp1-rbody div ul li a {
    display: flex;
    font-size: 0.16rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.44rem;
    letter-spacing: 0.01rem;
    color: #010000;
}

.comp1-rbody div ul li a p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.comp1-rbody div ul li a span {
    min-width: 1.2rem;
    margin-left: .15rem;
}




.publist2 li a {
    display: flex;
    align-items: center;
    position: relative;
    margin-top: .3rem;
}

.publist2 li a div {
    border: solid 0.01rem #1d2088;
    display: flex;
    align-items: center;
    margin-right: .15rem;
}

.publist2 li a div span {
    width: .45rem;
    text-align: center;
    background: #1d2088;
    font-size: 0.14rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.26rem;
    color: #ffffff;
}

.publist2 li a div b {
    font-size: 0.14rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.2rem;
    color: #000000;
    text-align: center;
    width: .5rem;
}

.publist2 li a p {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.18rem;
    /* font-weight: bold; */
    font-stretch: normal;
    line-height: 0.2rem;
    color: #010000;
}

.publist2 li a:hover p {
    color: #1d2088;
    font-weight: 600;
}

.publist2 li a:hover div span {
    color: #fff;
    background: #a21a28;
}

.publist2 li a i {
    width: 0.26rem;
    height: 0.2rem;
    text-align: center;
    font-size: 0.08rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.2rem;
    color: #ffffff;
    background: #a21a28;
    font-style: normal;
    margin-left: .15rem;

}

.comp2-c .publist2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.comp2-c .publist2 li {
    width: 48%;
}


.comp3-c {
    display: flex;
    justify-content: space-between;
}

.comp3-l {
    width: 48%;
}

.comp3-r {
    width: 48%;
}

.comp3, .comp2 {
    margin-top: 1.3rem;
}


/* 博奥体育,中超足球联赛简介 */
.college1 {
    display: flex;
    justify-content: space-between;
}

.college1-l {
    flex: 1;
    min-width: 0;
}

.college1-l p {
    font-size: 0.18rem;
    line-height: 0.34rem;
    letter-spacing: 1px;
    color: #010000;
    text-indent: 2em;
    text-align: justify;
}

.college1-r {
    width: 3.94rem;
    margin-left: 7%;
}


.college1-r img {
    display: block;
    width: 100%;
}

.college-jianzhu {
    display: flex;
    justify-content: flex-end;
    margin-top: .8rem;
}

.college2 {
    display: flex;
    position: relative;
    padding: .5rem 0 .5rem .5rem;
    align-items: center;
}

.college2::before {
    content: "";
    position: absolute;
    left: 0;
    right: -2.6rem;
    top: 0;
    bottom: 0;
    background: url(/images/college2-bg.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    z-index: 1;
}

.college2-l {
    flex: 1;
    min-width: 0;
    position: relative;
    z-index: 9;
}

.college2-l p {
    font-size: 0.18rem;
    line-height: 0.34rem;
    letter-spacing: 1px;
    color: #fff;
    text-indent: 2em;
    text-align: justify;
}

.college2-r {
    margin-left: 7%;
    position: relative;
    position: relative;
    z-index: 9;
}

.college2-r ul {
    position: relative;
}

.college2-r ul::before {
    content: "";
    position: absolute;
    width: 7.7rem;
    height: 7.7rem;
    left: .96rem;
    border-radius: 50%;
    border: 1px dashed rgba(249, 247, 240, .75);
    z-index: 1;
}

.college2-r ul li {
    margin-left: 1.72rem;
    position: relative;
    z-index: 9;
}

.college2-r ul li:nth-child(2) {
    margin: 1.2rem 0;
    margin-right: 0;
}

.college2-r ul li div {
    width: 1.92rem;
    height: 1.92rem;
    border: dashed 0.02rem #faf8f2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    padding-top: .2rem;
}

.college2-r ul li div p {
    font-size: 0.4rem;
    font-stretch: normal;
    line-height: 0.48rem;
    letter-spacing: 0.02rem;
    color: #ffffff;
}

.college2-r ul li div span {
    font-size: 0.22rem;
    font-stretch: normal;
    line-height: 0.48rem;
    letter-spacing: 0.01rem;
    color: #ffcdd2;
    margin-top: .1rem;
}

.college3 {
    margin-top: 1.2rem;
}

.college3-t {
    display: flex;
    align-items: center;
}

.college3-tl {
    width: 4.34rem;
    margin-right: 5%;
}

.college3-tl img {
    display: block;
    width: 100%;
}

.college3-tr {
    flex: 1;
    min-width: 0;
}

.college3-tr p {
    font-size: 0.18rem;
    line-height: 0.34rem;
    letter-spacing: 1px;
    color: #000;
    text-indent: 2em;
}

.college3-b {
    margin-top: .7rem;
}

.college3-b p {
    font-size: 0.18rem;
    line-height: 0.34rem;
    letter-spacing: 1px;
    color: #000;
    text-indent: 2em;
    text-align: justify;
}

/* 通知公告 */

.ntclist {
  /* background: url(/images/jgsz-bg.png) no-repeat;
    background-position: center center; */
}

.ntclist ul li {
    margin-top: .85rem;
}

.ntclist ul li:nth-child(1) {
    margin-top: 0;
}

.ntclist ul li a {
    display: flex;
    align-items: center;
}

.ntclist ul li a .date {
    width: 0.81rem;
    margin-right: .15rem;
}

.ntclist ul li a .date b {
    display: block;
    font-size: 0.25rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 0.3rem;
    letter-spacing: 1px;
    color: #a11a28;
    text-align: center;
}

.ntclist ul li a .date div {
    height: 0.03rem;
    background-color: #a11a28;
    margin: .1rem 0;
}

.ntclist ul li a .date span {
    display: block;
    font-size: 0.24rem;
    font-weight: bold;
    font-stretch: normal;
    line-height: 30px;
    letter-spacing: 1px;
    color: #a11a28;
    text-align: center;

}

.ntclist ul li a .info {
    flex: 1;
    min-width: 0;
    padding: .05rem 0;
    padding-left: .2rem;
    border-left: .1rem solid #a11a28;
}

.ntclist ul li a .info h3 {
    font-size: 0.2rem;
    font-stretch: normal;
    line-height: 0.3rem;
    color: #000000;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.ntclist ul li a .info p {
    font-size: 0.18rem;
    font-stretch: normal;
    line-height: 0.3rem;
    letter-spacing: 1px;
    color: #818181;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: .6rem;
    margin-top: .1rem;
}

.ntclist ul li a .info:hover h3 {
    color: #a11a28;
}


/* 创作展演 */
.creation {
    /* background: url(/images/jgsz-bg.png) no-repeat;
    background-position: center center;  */
}

.creation1 {
    display: flex;
    align-items: flex-end;
    padding: .4rem .2rem;
    background-color: rgba(29, 32, 136, .47);
    position: relative;
}

.creation1::before {
    content: "";
    position: absolute;
    left: -.2rem;
    bottom: -.2rem;
    right: 0;
    top: 0.2rem;
    background: url(/images/creation1-line.png) no-repeat;
    background-position: left bottom;
    z-index: 1;
}

.creation1-l {
    margin-top: -.65rem;
    width: 5rem;
    margin-right: .3rem;
    position: relative;
    z-index: 9;
}

.creation1-l img {
    display: block;
    width: 100%;
}

.creation1-r {
    flex: 1;
    min-width: 0;
    position: relative;
    z-index: 9;
}

.creation1-r h3 {
    font-size: 0.26rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.36rem;
    color: #ffffff;
    text-align: center;
}

.creation1-r p {
    font-size: 0.16rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.26rem;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    margin-top: .25rem;
}

.creation .tit {
    margin-top: 1rem;
    border: none;
}

.creation2 {
    margin-top: 0;
}

.creation2 ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.creation2 ul li {
    width: 45%;
    margin-top: .6rem;
}

.creation2 ul li a {
    display: flex;
    background: #fff;
    align-items: center;
}

.creation2 ul li a .date {
    width: 1.08rem;
    height: 1.19rem;
    background-color: rgba(50, 48, 122, .47);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.creation2 ul li a .date b {
    font-size: 0.3rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.3rem;
    color: #ffffff;
}

.creation2 ul li a .date div {
    width: 0.97rem;
    max-width: 100%;
    height: 0.02rem;
    margin: .1rem 0 .15rem 0;
    border: solid 0.02rem #ffffff;
}

.creation2 ul li a .date span {
    font-size: 0.3rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.3rem;
    color: #ffffff;
}

.creation2 ul li a .info {
    flex: 1;
    min-width: 0;
    padding: 0 .2rem;
}

.creation2 ul li a .info p {
    font-size: 0.18rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.29rem;
    color: #333333;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: .58rem;
}

.creation2 ul li a:hover .date b {
    color: #1d2088;
}

.creation2 ul li a:hover .date span {
    color: #1d2088;
}

.creation2 ul li a:hover .info p {
    color: #a11a28;
}