main .banner{width:100%;position:relative;white-space:nowrap;overflow-x:hidden}main .banner .banners{display:flex}main .banner img{width:100%;object-fit:cover;display:block;position:relative;top:0;left:0;z-index:1;opacity:0;transition:opacity 1s}main .banner img.show{opacity:1}main .banner .dots{position:absolute;bottom:40px;right:80px;z-index:2;display:flex}main .banner .dots .dot{display:flex;align-items:center;margin-right:20px;cursor:pointer;--color:rgba(255,255,255,0.5)}main .banner .dots .dot .line{width:30px;height:3px;transition:all 0.3s;background-color:var(--color)}main .banner .dots .dot .circle{width:16px;height:16px;border-radius:50%;transition:all 0.3s;border:3px solid var(--color)}main .banner .dots .dot.active{--color:#fff}@media (min-width: 320px) and (max-width: 480px){main .banner .dots{bottom:20px;right:20px}main .banner .dots .dot .line{width:16px;height:2px}main .banner .dots .dot .circle{width:8px;height:8px;border-width:2px}}@media (min-width: 481px) and (max-width: 768px){main .banner .dots{bottom:20px;right:20px}main .banner .dots .dot .line{width:20px;height:2px}main .banner .dots .dot .circle{width:10px;height:10px;border-width:2px}}@media (min-width: 769px) and (max-width: 1024px){main .banner .dots{bottom:20px;right:20px}main .banner .dots .dot .line{width:24px;height:2px}main .banner .dots .dot .circle{width:12px;height:12px;border-width:2px}}main .main{padding:30px 0}main .main .header{display:flex;flex-direction:column;align-items:center;justify-content:center}main .main .header .sub{color:#5e2982}main .main .header .title-box{display:flex;align-items:center;margin-top:10px}main .main .header .title-box .title{font-size:30px;font-weight:700;color:#333}main .main .header .title-box .line{width:100px;height:1px;background-color:#5e2982;margin:0 20px}main .main .content{display:flex;flex-wrap:wrap;padding:20px 90px 0 90px}main .main .content .item{width:calc(25% - 20px);margin:0 10px;position:relative;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item img{width:100%;display:block}main .main .content .item .intro{width:100%;background-color:#783aa1;border-top:2px solid #fff;padding:8px}main .main .content .item .intro .title{font-size:var(--main-title-size);color:#fff000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}main .main .content .item .intro .sub{min-height:40px;font-size:var(--sub-title-size);color:#fff;display:flex;align-items:center}main .main .content .item .intro .sub .desc{flex:1;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal}main .main .content .item .intro .sub button{white-space:nowrap;color:#783aa1;background-color:#fff;padding:6px 10px;border-radius:50px}main .main .content .item .intro .circle{--r:12px;width:calc(var(--r) * 2);height:calc(var(--r) * 2);border-radius:50%;background-color:#fff;position:absolute;bottom:calc(var(--r) * -1)}main .main .content .item .intro .circle.left{left:calc(var(--r) * -1)}main .main .content .item .intro .circle.right{right:calc(var(--r) * -1)}main .main .paginates{display:flex;align-items:center;justify-content:center}main .main .paginates .paginate{width:60px;height:60px;margin:0 10px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;user-select:none;background-image:url("/static/images/liubx_zs.png");background-repeat:no-repeat;background-size:100% 100%}main .main .paginates .paginate.ellipsis.next::after,main .main .paginates .paginate.ellipsis.prev::before{content:"..."}main .main .paginates .paginate.ellipsis:hover.next::after{content:'»'}main .main .paginates .paginate.ellipsis:hover.prev::before{content:'«'}main .main .paginates .paginate.active{background-image:url("/static/images/liubx_hs.png");cursor:default}main .main .paginates .controls{margin-left:30px;display:flex;align-items:center;justify-content:center}@media (min-width: 320px) and (max-width: 480px){main .main .header .title-box .title{font-size:24px}main .main .header .title-box .line{width:80px;margin:0 10px}main .main .content{padding:20px 20px 0 20px;flex-direction:column}main .main .content .item{width:100%;margin:0;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item .intro .title{font-size:14px}main .main .content .item .intro .sub{font-size:12px}main .main .content .item .intro .sub button{padding:4px 8px}main .main .paginates .paginate{width:30px;height:30px;margin-right:5px;font-size:12px}main .main .paginates .controls{margin-left:10px}}@media (min-width: 481px) and (max-width: 768px){main .main .header .title-box .title{font-size:24px}main .main .header .title-box .line{width:80px;margin:0 10px}main .main .content{padding:20px 20px 0 20px;flex-direction:column}main .main .content .item{width:100%;margin:0;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item .intro .title{font-size:14px}main .main .content .item .intro .sub{font-size:12px}main .main .content .item .intro .sub button{padding:4px 8px}main .main .paginates .paginate{width:36px;height:36px;margin-right:5px;font-size:12px}main .main .paginates .controls{margin-left:16px}}@media (min-width: 769px) and (max-width: 1024px){main .main .header .title-box .title{font-size:30px}main .main .header .title-box .line{width:100px;margin:0 20px}main .main .content{padding:20px 30px 0 30px}main .main .content .item{width:calc(50% - 20px);margin:0 10px;position:relative;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item .intro .title{font-size:14px}main .main .content .item .intro .sub{font-size:14px}main .main .content .item .intro .sub button{padding:6px 10px}main .main .paginates .paginate{width:40px;height:40px;margin-right:20px;font-size:16px}main .main .paginates .controls{margin-left:30px}}@media (min-width: 1025px) and (max-width: 1200px){main .main .header .title-box .title{font-size:36px}main .main .header .title-box .line{width:120px;margin:0 20px}main .main .content{padding:20px 40px 0 40px}main .main .content .item{width:calc(33.3333% - 20px);margin:0 10px;position:relative;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item .intro .title{font-size:16px}main .main .content .item .intro .sub{font-size:14px}main .main .content .item .intro .sub button{padding:8px 12px}main .main .paginates .paginate{width:40px;height:40px;margin-right:20px;font-size:16px}main .main .paginates .controls{margin-left:40px}}@media (min-width: 1201px) and (max-width: 1920px){main .main{width:100%;max-width:1200px;margin:0 auto;padding:60px 0}main .main .header .title-box .title{font-size:36px}main .main .header .title-box .line{width:140px;margin:0 20px}main .main .content{padding:40px 60px 0 60px}main .main .content .item{margin:0 10px;position:relative;margin-bottom:30px}main .main .content .item:last-child{margin-right:0}main .main .content .item .intro .title{font-size:16px}main .main .content .item .intro .sub{font-size:14px}main .main .content .item .intro .sub button{padding:4px 8px}main .main .paginates{margin-top:10px}main .main .paginates .paginate{width:50px;height:50px;margin-left:0;margin-right:20px;font-size:20px}main .main .paginates .paginate.ellipsis.next::after,main .main .paginates .paginate.ellipsis.prev::before{content:"..."}main .main .paginates .paginate.ellipsis:hover.next::after{content:'»'}main .main .paginates .paginate.ellipsis:hover.prev::before{content:'«'}main .main .paginates .controls{margin-left:50px}}