/**********************************************
 * @Object      首页
 * @Authors     Foxs
***********************************************/
.atlas-section .atlas-content{padding:10px}
.atlas-section .atlas-items{display: flex;align-items: center;flex-wrap: wrap;border-radius: 10px;background-color: #fff;padding:10px}
.atlas-section .atlas-items .item{width:20%;padding: 10px;text-decoration: none;border-radius: 5px}
.atlas-section .atlas-items .item .item-flex{width:100%;height: auto;position: relative;}
.atlas-section .atlas-items .item .item-flex .thumb{position:relative;border-radius: 5px;overflow: hidden;cursor: pointer;height: 0px;padding-top: 150%;background-color: var(--BackColor,#f7f7f7);}
.atlas-section .atlas-items .item .item-flex .thumb .loading{position: absolute;top:0px;right:0px;bottom:0px;left:0px;margin:50% auto;}
.atlas-section .atlas-items .item .item-flex .thumb .img{display: block;width:100%;height: 100%;}
.atlas-section .atlas-items .item .item-flex .thumb .img img{width:100%;height: 100%;object-fit: cover;position: absolute;top: 0px;left: 0px;z-index: 1;transition: all 0.5s;}
.atlas-section .atlas-items .item .item-flex:hover .img img{transform: scale(1.05);}
.atlas-section .atlas-items .item .item-flex .thumb .new{position: absolute;top: 0px;left: -1px;color: var(--MatchColor,#db4646);z-index: 9}
.atlas-section .atlas-items .item .item-flex .thumb .new i{font-size: 40px;}
.atlas-section .atlas-items .item .item-flex .title{display: block;font-size: 12px;color:#666;line-height: 40px;padding:0px 10px;text-align: center;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.atlas-section .atlas-items .item .item-flex .likes{position: absolute;top:20px;left: 20px;background-color: rgba(0, 0, 0,0.8);font-size: 12px;color:#fff;width:30px;height: 30px;border-radius: 15px;text-align: center;line-height: 30px;z-index: 99;display: none;cursor: pointer;}
.atlas-section .atlas-items .item .item-flex .likes-on{background-color:var(--MatchColor,#db4646);}
.atlas-section .atlas-items .item .item-flex:hover .likes{display: block;}
@media screen and (max-width:768px){
    .atlas-section .atlas-items{padding: 4px;}
    .atlas-section .atlas-items .item{width: 50%;padding: 4px}
}


/*图集详情*/
.atlas-infos .atlas-images{width: 100%;padding:20px;}
.atlas-infos .atlas-images .items{width: 100%}
.atlas-infos .atlas-images .items span.img{display:block;width:100%;padding-bottom:5px;cursor: pointer;}
.atlas-infos .atlas-images .items span.img img{width:100%;border-radius: 5px;}


.atlas-infos .atlas-images .imginfo{display: flex;flex-direction: column;align-items: center;padding:20px 0px;}
.atlas-infos .atlas-images .imginfo .tips{display: flex;justify-content: center;color:#aaa}
.atlas-infos .atlas-images .imginfo .tips b{color:var(--MatchColor,#db4646);padding:0px 5px;cursor: pointer;}
.atlas-infos .atlas-images .imginfo .btns{display: flex;align-items: center;margin-top: 15px;}
.atlas-infos .atlas-images .imginfo .item{text-align: center;padding:10px 10px;border-radius: 5px;background-color: var(--BackColor,#f7f7f7);color: #666;cursor: pointer;font-size: 12px;margin:0px 5px}
.atlas-infos .atlas-images .imginfo .loads{padding:10px 25px;color:#fff;background-color: var(--MatchColor,#ff2d5a);}

.atlas-infos .atlas-images .logtip{display: flex;flex-direction: column;align-items: center;padding:30px 0px;background-color: var(--BackColor,#f7f7f7);border-radius: 10px;margin-top: 20px}
.atlas-infos .atlas-images .logtip .tips{font-size: 14px;text-align: center;padding-bottom:20px;margin-bottom: 0px;font-weight: bold;}
.atlas-infos .atlas-images .logtip .tips b{font-size: 20px;padding:10px;color:var(--MatchColor,#ff2d5a);cursor: pointer;}
.atlas-infos .atlas-images .logtip .tips b:last-child{font-size: 14px;padding:0px;padding-right: 5px;font-weight: 600}
.atlas-infos .atlas-images .logtip .logbtn{width:150px;text-align: center;padding:10px 0px;border-radius: 5px;margin:0px 20px;color:#fff;background-color: var(--MatchColor,#ff2d5a);cursor: pointer;}

/*图集：图集未解锁*/
.atlas-infos .atlas-unlock{width:100%;height:auto;padding:20px 20px;border-radius: 5px;}
.atlas-infos .atlas-unlock .unlock-info{padding:30px;background-color: var(--BackColor,#f7f7f7);}
.atlas-infos .atlas-unlock .unlock-info p.tip{font-size: 14px;text-align: center;padding-bottom:20px;margin-bottom: 0px;font-weight: bold;}
.atlas-infos .atlas-unlock .unlock-info p.tip b{font-size: 20px;padding:10px;color:var(--MatchColor,#ff2d5a);cursor: pointer;}
.atlas-infos .atlas-unlock .unlock-info p.tip b:last-child{font-size: 18px}
.atlas-infos .atlas-unlock .unlock-info .btns{display: flex;justify-content: center;}
.atlas-infos .atlas-unlock .unlock-info .btns .btn-item{width:150px;text-align: center;padding:10px 0px;border-radius: 5px;margin:0px 20px;color:#fff;background-color: var(--MatchColor,#ff2d5a);cursor: pointer;}
.atlas-infos .atlas-unlock .unlock-info .btns .btn-item span{font-weight: bold;}
.atlas-infos .atlas-unlock .unlock-info .btns .btn-item span.ico{margin-right: 3px;}
.atlas-infos .atlas-unlock .unlock-info .btns .btn-item span.ico i{font-size: 14px;}
.atlas-infos .atlas-unlock .unlock-info .btns .open-member{background-image: linear-gradient(160deg, #fdefc4 0%, #fbce8c 100%);color: #735210}
.atlas-infos .atlas-unlock .unlock-info .btns .one-unlock{background-color: #5fb878;}
.atlas-infos .atlas-unlock .unlock-info .btns .fcoin-unlock{background-color: var(--ThemeColor,#ff2d5a);}

/*图集申明*/
.atlas-infos .atlas-readme{padding:20px}
.atlas-infos .atlas-readme .readme-info{width: 100%;background-color: var(--BackColor,#f7f7f7);padding: 20px;}
.atlas-infos .atlas-readme .readme-info .tips{display: block;color: var(--MatchColor,#ff2d5a);padding: 10px 0px;font-weight: bold;}
.atlas-infos .atlas-readme .readme-info .text{width: 100%;line-height: 35px;font-size: 14px;color: #999;}
.atlas-infos .atlas-readme .readme-info .text b{color: var(--MatchColor,#ff2d5a);}
@media screen and (max-width:768px){
    .atlas-infos .atlas-images,
    .atlas-infos .atlas-unlock,
    .atlas-infos .atlas-readme{padding:5px}
    .atlas-infos .atlas-unlock .unlock-info{padding:20px 10px}
    .atlas-infos .atlas-unlock .unlock-info .btns .btn-item{width:auto;padding:8px 15px;font-size: 12px;margin:0px 8px}
}


/*侧边栏*/
.atlas-sidebar .baseinfo{}
.atlas-sidebar .baseinfo .modoinfo{padding:20px;background-color: #f7f7f7;display: flex;flex-direction: column;align-items: center;}
.atlas-sidebar .baseinfo .modoinfo .thumb{width:80px;height: 80px;border-radius: 50%;overflow: hidden;margin-top:20px;text-decoration: none;}
.atlas-sidebar .baseinfo .modoinfo .thumb img{width:100%;border-radius: 50%;}
.atlas-sidebar .baseinfo .modoinfo .title{display: flex;flex-direction: column;align-items: center;text-decoration: none;}
.atlas-sidebar .baseinfo .modoinfo .title .name{font-size: 14px;color:#888;padding:10px 0px;}
.atlas-sidebar .baseinfo .modoinfo .title .alias{font-size: 14px;color:#aaa;padding:5px 0px}
.atlas-sidebar .baseinfo .modoinfo .follow{display: flex;justify-content: center;margin:10px auto;}
.atlas-sidebar .baseinfo .modoinfo .follow .likes{display: flex;align-items: center;padding:5px 10px;border-radius: 5px;background-color: #ddd;color:#444;cursor: pointer;}
.atlas-sidebar .baseinfo .modoinfo .follow .likes i{font-size: 14px;margin-right: 5px;margin-left: 5px}
.atlas-sidebar .baseinfo .modoinfo .follow .likes .text{font-size: 12px;}
.atlas-sidebar .baseinfo .modoinfo .follow .likes .num{font-size: 12px;}
.atlas-sidebar .baseinfo .modoinfo .follow .likes:hover{font-weight: bold;}
.atlas-sidebar .baseinfo .modoinfo .follow .likes-on{background-color: var(--MatchColor,#db4646);color:#fff;}
.atlas-sidebar .baseinfo .modoinfo .tags{display: flex;align-items: center;justify-content: center;margin: 15px 0px;}
.atlas-sidebar .baseinfo .modoinfo .tags .it{padding:5px 8px;border-radius: 3px;background-color:var(--ThemeColor,'#2c2c2c');font-size: 12px;color:#eee;margin:0px 5px}

.atlas-sidebar .thiscoms{width:100%;display: flex;justify-content: space-between;flex-wrap: wrap;margin-top: 15px;}
.atlas-sidebar .thiscoms a{display: block;width:32%;margin-top:2%;}
.atlas-sidebar .thiscoms a img{display:block;width:100%;border-radius: 3px;}