/**************************************
 * @Obj        壁纸
 * @Authors    Enjoy
 **************************************/
/*壁纸：首页*/
.wallpaper-section{padding:0px 10px;}
.wallpaper-section .section-content{position: relative;}
.wallpaper-section .section-content .types{display: flex;justify-content: center;padding:10px 0px}
.wallpaper-section .section-content .types .titem{padding:10px 20px;background-color: #fff;color:#333;margin: 0px 10px;border-radius: 10px}
.wallpaper-section .section-content .types .titem:hover,
.wallpaper-section .section-content .types .titem-on{background-color: var(--MatchColor,#db4646);color:#fff}

.wallpaper-section .follow-tools .tool-items .item-computer .ico i{font-size: 18px}
.wallpaper-section .follow-tools .tool-items .item-on .ico{background-color: var(--MatchColor,#db4646);color:#fff;}
.wallpaper-section .wallpaper-types{position: absolute;left: -100px;width: 90px;height: 100%;top:0px}
.wallpaper-section .wallpaper-types .type-items{display: flex;flex-direction: column;align-items: center;background-color: #fff;padding:10px 10px;border-radius: 5px;position: sticky;top: 120px}
.wallpaper-section .wallpaper-types .type-items .item{padding:5px 20px;margin:5px 0px;font-size: 12px;color:#888;}
.wallpaper-section .wallpaper-types .type-items .item-on{background-color: var(--MatchColor,#db4646);color:#fff;border-radius: 5px}
.wallpaper-section .wallpaper-types .type-items .item:hover{color:var(--MatchColor,#db4646);font-weight: bold;}
.wallpaper-section .wallpaper-types .type-items .item-on:hover{opacity: 0.8;color:#fff}



.wallpaper-section .wallpaper-terminal{border-radius: 5px;margin: 10px 0px;}
.wallpaper-section .wallpaper-terminal .head{display: flex;align-items: center;justify-content: space-between;padding: 20px 10px}
.wallpaper-section .wallpaper-terminal .head .title{font-size: 14px;font-weight: bold;position: relative;padding-left: 5px;}
.wallpaper-section .wallpaper-terminal .head .title::before{
    content: '';
    top: 0px;
    left: -10px;
    width: 5px;
    height: 16px;
    /*border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid var(--MatchColor,#db4646);*/
    background-color: var(--MatchColor,#db4646);
    position: absolute;
    z-index: 9;
}
.wallpaper-section .wallpaper-terminal .head .more{display: flex;font-size: 12px;color: #aaa;cursor: pointer;margin-right:15px}
.wallpaper-section .wallpaper-terminal .head .more i{margin-right: 5px;font-size: 12px;}
.wallpaper-section .wallpaper-terminal .head .more:hover{color:var(--MatchColor,#db4646);font-weight: bold;}
.wallpaper-section .wallpaper-index{background-color: #fff;padding:10px 0px}
/*壁纸列表*/
.wallpaper-section .wallpaper-terminal .wallpaper-items{display: flex;align-items: center;flex-wrap: wrap;padding:10px;background-color: #fff;border-radius: 10px;}
.wallpaper-section .wallpaper-terminal .wallpaper-items .item{width: 20%;padding: 5px;cursor: pointer;}
.wallpaper-section .wallpaper-terminal .wallpaper-btns{display: flex;align-items: center;justify-content: center;padding:15px 0px}
.wallpaper-section .wallpaper-terminal .wallpaper-btns .btn{padding:10px 20px;background-color: #f7f7f7;font-size: 12px;color:#666;margin:0px 10px}
/*电脑壁纸*/
.wallpaper-section .wallpaper-computer .wallpaper-items .item .item-flex{display: flex;flex-direction: column;}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb{position:relative;background-color:#fff;width: 100%;padding-top: 60%;border-radius: 5px;overflow: hidden;}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb .loading{position: absolute;width:100%; height:100%;z-index: 1;display: flex;justify-content: center;align-items: center;top: 0px;left: 0px;right: 0px;bottom: 0px;}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb .img{display: block;width:100%;height:100%;overflow: hidden;position: absolute;top: 0px;left: 0px;right: 0px;bottom: 0px;z-index: 9;border-radius: 5px;overflow: hidden;transition: all 0.3s}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb .img img{width:100%;height: 100%;object-fit: cover;transform: scale(1);transition: all 0.5s;}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb:hover .img{width:90%;height:90%;border:10px solid #111;border-radius: 5px;top:5%;bottom:5%;left:5%;right: 5%}
.wallpaper-section .wallpaper-computer .wallpaper-items .item .thumb:hover .img img{transform: scale(0.8);border-radius: 5px}

/*手机壁纸*/
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb{position:relative;background-color:#fff;width: 100%;padding-top: 180%;border-radius: 5px;overflow: hidden;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .loading{position: absolute;width:100%; height:100%;z-index: 1;display: flex;justify-content: center;align-items: center;top: 0px;left: 0px;right: 0px;bottom: 0px;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .img{display: block;width:100%;height:100%;overflow: hidden;position: absolute;top: 0px;left: 0px;right: 0px;bottom: 0px;z-index: 9;border-radius: 5px;overflow: hidden;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .img img{width:100%;height: 100%;object-fit: cover;transform: scale(1);transition: all 0.5s;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover  .img img{transform: scale(1.1);}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .mask{position: absolute;top: 0px;left: 0px;right: 0px;bottom: 0px;background: rgba(0, 0, 0, 0);z-index: 99;transition: all 0.3s;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .mask .times{display: block;width: 100%;text-align: center;font-size: 10px;color: #fff;margin-top: 100px;opacity: 0;transition: all 0.3s;font-family: 'ali-fangyuanti';}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .mask .dates{display: block;width: 100%;text-align: center;font-size: 10px;color: #fff;margin-top: 10px;opacity: 0;transition: all 0.3s;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .mask .download{position: absolute;bottom: 20px;right: 20px;color: #eee;cursor: pointer;opacity: 0;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb .mask .codeview{position: absolute;bottom: 20px;left: 20px;color: #eee;cursor: pointer;opacity: 0;display: none;}

.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover .mask{display: block;border-radius: 5px;background: rgba(0, 0, 0, 0.2);}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover .times{opacity: 1;font-size: 40px;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover .dates{opacity: 1;font-size: 14px;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover .download{opacity: 1;font-size: 14px;}
.wallpaper-section .wallpaper-mobile .wallpaper-items .item .thumb:hover .codeview{opacity: 1;font-size: 20px;}


@media screen and (max-width:768px){
	.wallpaper-section{padding:5px}
	.wallpaper-section .wallpaper-terminal .wallpaper-items{padding: 0px;}
	.wallpaper-section .wallpaper-terminal .wallpaper-items .item{width: 50%;padding: 4px}
	.wallpaper-section .wallpaper-terminal .wallpaper-items .item .item-flex{padding: 0px}
	.wallpaper-section .wallpaper-terminal .wallpaper-items .item .img{top: 0px;left: 0px;right: 0px;bottom: 0px}
	.wallpaper-mobile .wallpaper-items .item .thumb .mask{display: none;}
	.wallpaper-mobile .wallpaper-items .item .thumb:hover .mask{display: none;}
}

/*壁纸：详情（电脑端）*/
.wallpaper-section .wallpaper-infos{margin:10px auto;position:relative;}
.wallpaper-section .wallpaper-infos .wallpaper-view{width: 100%;background-color: #fff;border-radius: 5px;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box{width: 1180px;position: relative;margin: 0px auto;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box span.img_bcck{display: block;width: 100%;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box span.img_bcck img{border-radius:5px;width: 100%}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb{position: absolute;width: 721px;height: 417px;top: 40px;left: 233px;overflow: hidden;border-radius: 3px;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb img{width: 100%;height: 100%;object-fit: cover;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb .full_screen_view{position: absolute;right: 0px;left: 0px;bottom: 0px;top: 0px;background-color: rgba(0, 0, 0, 0.3);
display: flex;flex-direction: column;justify-content: center;align-items: center;display: none;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb .full_screen_view .goto_view{padding: 10px 20px;border-radius: 5px;background-color: var(--MatchColor,#db4646);color: #fff;cursor: pointer;text-decoration: none;}
.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb:hover .full_screen_view{display: flex;z-index: 9;}

@media screen and (max-width:768px){
	.wallpaper-section .wallpaper-infos .wallpaper-view .view_box{width: 100%}
	.wallpaper-section .wallpaper-infos .wallpaper-view .view_box span.img_bcck{display: none;}
	.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .img_thumb{width: 100%;height: auto;position: static;padding: 10px 10px;border-radius: 5px;background-color: #fff;}
	.wallpaper-section .wallpaper-infos .wallpaper-view .view_box .full_screen_view{display: none;}
}


.wallpaper-section .wallpaper-infos .wallpaper-downloads{padding: 30px 20px;background-color: #fff;display: flex;justify-content: center;align-items: center;margin-bottom: 20px;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .item{padding: 15px 30px;border-radius: 5px;font-size: 14px;display: flex;align-items: center;cursor: pointer;transition: all 0.5s;margin:0px 10px}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .item i{font-size: 14px;margin-right: 5px;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .likes{background-color: var(--SimpleColor,#eeeeee);color: #666;transition: all 0.5s;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .likes-on{background-color: var(--LikeColor,#ff7200);color:#fff}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .likes:hover{color: #444;font-weight: bold;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .likes-on:hover{color:#eee;font-weight: bold;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .goods{background-color: var(--SimpleColor,#eeeeee);color: #666;transition: all 0.5s;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .goods-on{background-color: var(--MatchColor,#222222);color:#fff}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .goods:hover{color: #444;font-weight: bold;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .goods-on:hover{color:#eee;font-weight: bold;}

.wallpaper-section .wallpaper-infos .wallpaper-downloads .downs{display: flex;align-items: stretch;background-color:var(--MatchColor,#db4646);color: #fff;padding: 15px 30px;cursor: pointer;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .downs span.text{font-size: 14px;}
.wallpaper-section .wallpaper-infos .wallpaper-downloads .downs:hover{opacity: 0.8}
@media screen and (max-width:768px){
	.wallpaper-section .wallpaper-infos .wallpaper-downloads{padding:20px 5px}
	.wallpaper-section .wallpaper-infos .wallpaper-downloads .item{padding:10px 15px;margin:0px 5px}
}

/*壁纸：详情（手机端）*/
.wallpaper-infos .mobile-infos{display: flex;align-items: stretch;justify-content: space-between;padding: 10px 0px;}
.wallpaper-infos .mobile-infos .preview{width: 100%;display: flex;align-items: stretch;justify-content: space-between;box-shadow: 0px 0px 10px #ddd;padding: 20px 20px;background-color: #fff;margin-right: 20px;border-radius: 10px;}
.wallpaper-infos .mobile-infos .preview .viewitem{width: 48.5%;padding: 20px 30px;}
.wallpaper-infos .mobile-infos .preview .viewitem .img{display: block;width: 100%}
.wallpaper-infos .mobile-infos .preview .viewitem .img img{width: 100%;margin: 0px;border-radius: 10px;}
.wallpaper-infos .mobile-infos .preview .viewitem .title{text-align: center;margin: 20px 10px;font-weight: bold;color: #111;font-size: 20px;}
.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top{position: absolute;top: 10px;left: 10px;right: 10px;display: flex;align-items: stretch;justify-content: space-between;padding: 6px 10px;}
.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .time{color: #fff;font-size: 14px;}
.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .infos{display: flex;align-items: center;}
.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .infos .it{padding: 0px 5px;color: #fff}
.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .infos .it i{font-size: 10px;}

.wallpaper-infos .mobile-infos .preview .home .infobox{width: 100%;position: relative;border: 3px solid #111;border-radius: 15px;overflow: hidden;}
.wallpaper-infos .mobile-infos .preview .home .infobox .botm{position: absolute;bottom: 20px;left: 20px;right: 20px;display: flex;align-items: center;justify-content: space-between;padding: 6px 10px;background-color: rgba(255, 255, 255, 0.2);border-radius: 20px;}
.wallpaper-infos .mobile-infos .preview .home .infobox .botm .item{width: 22%;padding: 5px}
.wallpaper-infos .mobile-infos .preview .home .infobox .botm .item img{width: 100%}


.wallpaper-infos .mobile-infos .preview .screen .infobox{width: 100%;position: relative;border: 3px solid #111;border-radius: 15px;overflow: hidden;}
.wallpaper-infos .mobile-infos .preview .screen .infobox .dateinfo{position: absolute;top: 100px;left: 0px;right: 0px;display: flex;flex-direction: column;align-items: center;}
.wallpaper-infos .mobile-infos .preview .screen .infobox .dateinfo .times{font-size: 50px;color: #fff;font-weight: bold;}
.wallpaper-infos .mobile-infos .preview .screen .infobox .dateinfo .dates{width: 128px;display: flex;align-items: center;justify-content: space-between;margin-top: 10px;padding: 0px 10px}
.wallpaper-infos .mobile-infos .preview .screen .infobox .dateinfo .dates .days{font-size: 16px;color: #eee}
.wallpaper-infos .mobile-infos .preview .screen .infobox .dateinfo .dates .week{font-size: 16px;color: #eee;}
.wallpaper-infos .mobile-infos .preview .screen .infobox .botm{position: absolute;bottom: 20px;left: 30px;right: 30px;display: flex;align-items: center;justify-content: space-between;}
.wallpaper-infos .mobile-infos .preview .screen .infobox .botm .item{width: 40px;height: 40px;border-radius: 50%;display: flex;justify-content: center;align-items: center;background-color: rgba(0, 0, 0, 0.5);}
.wallpaper-infos .mobile-infos .preview .screen .infobox .botm .item i{font-size: 18px;color: #eee}

.wallpaper-infos .mobile-infos .baseinfo{width: 30%;min-width: 350px;flex-shrink: 0;margin-left: 10px;flex-shrink: 0;display: flex;flex-direction: column;justify-content: space-between;}
.wallpaper-infos .mobile-infos .baseinfo .attrs{width: 100%;height: 100%;background-color: #fff;padding: 30px 30px;border-radius: 5px;display: flex;flex-direction: column;justify-content: space-between;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item{padding: 15px 0px;font-size: 14px;color: #666;display: flex;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item .ident{padding: 3px 10px;background: #eee;border-radius: 3px;color: #666;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item .text{width: 80px;flex-shrink: 0;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item-tags .text{padding-top: 7px;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item-tags .tags{display: flex;align-items: center;flex-wrap: wrap;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .item-tags .tags a{padding: 3px 10px;background: #333;border-radius: 3px;margin: 5px 5px;color: #fff;cursor: pointer;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .down-tips{display: flex;align-items: center;justify-content: center;background-color:#f7f9fc;color: #666;margin-bottom: 15px;padding: 20px 0px}
.wallpaper-infos .mobile-infos .baseinfo .attrs .down-tips span.tip{font-size: 12px;padding: 10px 20px;}
.wallpaper-infos .mobile-infos .baseinfo .attrs .down-tips span.tip b{color: var(--MatchColor,#db4646);padding: 0px 5px;cursor: pointer;}

.wallpaper-infos .mobile-infos .mview{width: 100%;height: 45%;background-color: #fff;padding: 30px 30px;margin-top: 20px;border-radius: 5px;flex-shrink: 0;}
.wallpaper-infos .mobile-infos .mview .code{width: 100%;display: flex;flex-direction: column;}
.wallpaper-infos .mobile-infos .mview .code .tips{padding-bottom: 10px;padding-left: 5px;text-align: center;}
.wallpaper-infos .mobile-infos .mview .code .img{margin-top: 10px;padding:10px 25px;}
.wallpaper-infos .mobile-infos .mview .code .img img{width: 100%;}

@media screen and (max-width:600px){
	.wallpaper-infos .mobile-infos{display: flex;flex-direction: column;align-items: center;}
	.wallpaper-infos .mobile-infos .preview{width: 100%;margin-right: 0px;padding: 10px;}
	.wallpaper-infos .mobile-infos .preview .viewitem{padding: 0px;}
	.wallpaper-infos .mobile-infos .preview .viewitem .title{font-size: 16px;}
	.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top{padding: 0px;}
	.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .time{font-size: 12px;margin-top: 4px;}
	.wallpaper-infos .mobile-infos .preview .viewitem .infobox .top .infos .it i{font-size: 8px;margin-bottom: 2px;}
	.wallpaper-infos .mobile-infos .preview .home .infobox .bottom{bottom: 10px;left: 10px;right: 10px}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .times{font-size: 40px;}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .dates .days{font-size: 12px;}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .dates .week{font-size: 12px;}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .bottom{bottom: 20px;left: 10px;right: 10px}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .bottom .item{width: 30px;height: 30px;}
	.wallpaper-infos .mobile-infos .preview .screen .infobox .bottom .item i{font-size: 12px;}
	.wallpaper-infos .mobile-infos .baseinfo{width: 100%;margin-left: 0px;margin-top:10px}
	.wallpaper-infos .mobile-infos .mview{width: 100%;margin-left: 0px;margin-top: 10px;height: auto;}
}