@charset "utf-8";
.wrap-box{width: 100%; min-width: 1190px; padding-top: 15px; background: url(../../images/list-2024/list-bg.png) center top no-repeat #EFEFEF; background-size: 2500px; }
.wrap-box .main-box{ width: 1190px; margin: 0 auto; }
.list-swiper{ width: 1190px;  height: 100px; border-radius: 10px; overflow: hidden; margin-bottom: 15px; }
.list-swiper .slideBox { width: 1190px; height: 100px; overflow: hidden; position: relative; }
.list-swiper .slideBox .bd li { width: 1190px; height: 100px; overflow: hidden}
.list-swiper .slideBox .bd li img { width: 1190px; height: 100px;}
.list-swiper .slideBox .hd { position: absolute; bottom: 10px; z-index: 1; right: 10px;}
.list-swiper .slideBox .hd li {float: left; overflow: hidden; color: #fff; text-align: center; cursor: pointer; position: relative; background: #FFFFFF; background: rgba(255,255,255,.5); filter: alpha(opacity=50); width: 7px; height: 7px; border-radius: 50%; margin-left: 6px;}
.list-swiper .slideBox .hd li.on { color: #fff; background: #ff5c00; text-decoration: none; width: 18px; border-radius: 5px;}
.all-gtchose{ background: #FFFFFF; display: flex; align-items: center; border-radius: 10px ; padding: 16px 40px; margin-bottom: 2px; }
.all-gtchose .gt-left img{ display: block; width: 50px; }
.all-gtchose .gt-right{ margin-left: 30px;  }
.all-gtchose .gt-right ul{ }
.all-gtchose .gt-right ul li{ float: left; font-size: 15px; color: #222222; line-height: 25px; margin-right:15px; cursor: pointer; position: relative; }
.all-gtchose .gt-right ul li.on{ font-weight: 700; color: #ff5c00; }
.all-gtchose .gt-right ul li:hover{ color: #ff5c00; }
.all-gtchose .gt-right ul li .hot-gt{ position: absolute; right: -10px; top: -5px; }
.filter-screen{ background: #FFFFFF; padding: 0 30px; border-radius: 10px; position: relative; z-index: 3; }
.filter-screen .filter-head{ height: 54px;  display: flex; align-items: center; justify-content: space-between;  position: relative; z-index: 1; }
.filter-screen .filter-head .filter-head-le{ display: flex; align-items: center; line-height: 20px;}
.filter-screen .filter-head .filter-head-le h3{ font-weight: 700; font-size: 12px; color: #222222; padding-left: 20px; }
.filter-screen .filter-head .filter-head-le a.filter-his{ margin-left: 30px; color: #0C80EF;}
.filter-screen .filter-head .filter-head-le a.filter-his i{ margin-left: 3px; }
.filter-screen .filter-head .filter-head-le a.filter-his.trans i img{transform: rotate(180deg);}
.filter-screen .filter-head .filter-head-le a.filter-rst{ margin-left: 30px; font-size: 12px; color: #666666; padding-left: 23px; background: url(../../images/list-2024/rst-icon.png) no-repeat left center; background-size: 20px; }
.filter-screen .filter-head .filter-head-le a.filter-copy{ margin-left: 30px; font-size: 12px; color: #666666; padding-left: 23px; background: url(../../images/list-2024/share-icon.png) no-repeat left center; background-size: 20px; }

.filter-screen .filter-head .filter-his-pop{ position: absolute; display: none; left: -30px; top: 44px; width: 1130px; padding: 0 30px; background: #FFFFFF;box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.2); border-radius: 10px }
.filter-screen .filter-head .filter-his-pop .his-pop-head{ height: 54px; line-height: 54px; }
.filter-screen .filter-head .filter-his-pop .his-pop-head h3{ font-weight: 700; font-size: 14px; color: #222222;}
.filter-screen .filter-head .filter-his-pop .his-pop-head h3 span{ font-weight: 400; font-size: 12px; color: #999999; margin-left: 8px; }
.filter-screen .filter-head .filter-his-pop .his-pop-bottom ul li{ border-top: 1px dotted #E5E5E5;  cursor: pointer; display: flex; justify-content: space-between; align-items: center; height: 42px; line-height: 42px; }
.filter-screen .filter-head .filter-his-pop .his-pop-bottom ul li p { max-width: 1000px; height: 42px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.filter-screen .filter-head .filter-his-pop .his-pop-bottom ul li p em{ color: #666666; font-weight: 700; margin-right: 10px; }
.filter-screen .filter-head .filter-his-pop .his-pop-bottom ul li:hover{ color: #ff5c00; }
.filter-screen .filter-head .filter-head-ri{ display: flex; justify-content:flex-end; align-items: center; }
.filter-screen .filter-head .filter-head-ri a.not-find{ margin-right: 10px; }
.filter-screen .filter-head .filter-head-ri a img{ display: block; }
.filter-screen .filter-bottom{ padding-bottom: 5px; }
.filter-screen .filter-bottom .filter-item{ border-top: 1px dotted #E5E5E5; padding: 10px 0 0 0; min-height: 32px; position: relative;}
.filter-screen .filter-bottom .filter-item .item-left{ float: left; padding-left: 20px; line-height: 32px; width: 65px; text-align: left;  }
.filter-screen .filter-bottom .filter-item .item-right{ padding-left: 98px;}
.filter-screen .filter-bottom .filter-item .item-right .right-tow{ display: flex; align-items: center; flex-wrap: wrap; }
.filter-screen .filter-chose{ display: flex; align-items: center; flex-wrap: wrap; }
.filter-screen .filter-chose .chose-item{ height: 30px; line-height: 30px; color: #222; margin-bottom: 10px; cursor: pointer; margin-right: 10px; padding:0 10px; background: #FAFAFA; border: 1px solid #CCCCCC; border-radius: 3px; }
.filter-screen .filter-bottom .filter-chose .chose-item{ background: #ffffff; }
.filter-screen .filter-bottom .filter-chose .chose-item img{ vertical-align: middle; margin: -4px 4px 0 0; }
.filter-screen .filter-chose .chose-item.on{ background: #FFEEE4; border: 1px solid #FF5C00; color:#FF5C00; }
.filter-screen .filter-chose .chose-select{height: 30px; position: relative; padding: 0 8px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; margin: 0 10px 10px 0; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.filter-screen .filter-chose .chose-select p{font-size: 12px;  color: #222222; height: 30px; line-height: 30px; max-width:74px; overflow: hidden; }
.filter-screen .filter-chose .chose-select .normal{display: block;}
.filter-screen .filter-chose .chose-select .chosing{display: none;}
.filter-screen .filter-chose .chose-select .chosed{display: none;}
.filter-screen .filter-chose .chose-select .close-icon{ position: absolute; top: -6px; right: -6px; display: none; }
.filter-screen .filter-chose .chose-select.selected{ border-color:#ff5c00; color: #ff5c00; background: #FFEEE4; }
.filter-screen .filter-chose .chose-select.selected p{ color: #ff5c00; }
.filter-screen .filter-chose .chose-select.selected .normal{display: none;}
.filter-screen .filter-chose .chose-select.selected .chosing{display: none;}
.filter-screen .filter-chose .chose-select.selected .chosed{display: block;}
.filter-screen .filter-chose .chose-select.selected .close-icon{ display: block; }
.filter-screen .filter-chose .chose-select.trans{ border-color:#ff5c00; color: #ff5c00; }
.filter-screen .filter-chose .chose-select.trans p{ color: #ff5c00; }
.filter-screen .filter-chose .chose-select.trans .normal{display: none;}
.filter-screen .filter-chose .chose-select.trans .chosing{display: block;}
.filter-screen .filter-chose .chose-select.trans .chosed{display: none;}
.filter-screen .filter-chose .chose-select-tips{ width: 236px; height:36px; margin: -44px 0 0 -39px; z-index: 0; display: flex; align-items: center; justify-content: flex-end; background: url(../../images/list-2024/server-tip-bg.png) no-repeat; background-size: 100%; }
.filter-screen .filter-chose .chose-select-tips img{ cursor: pointer; margin: -7px 8px 0 0; }
.filter-screen .filter-chose .qfht-tips{ margin: 0 10px 10px 0; display: flex; align-items: center; }
.filter-screen .filter-chose .qfht-tips img{ display: block; margin-right: 5px; height: 20px; }
.filter-screen .filter-pop{ position: absolute; width: 1190px; left:-30px; background: #ffffff; z-index:3; }
.filter-screen .filter-pop .filter-pop-box{ padding: 0 30px 15px 30px; box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.2); border-radius: 10px; display: none; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab{height: 46px; overflow: hidden; background: #FFF1EA; margin-left: -30px; margin-right: -30px; border-radius: 10px 10px 0 0; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul{ overflow: hidden; border-radius: 10px 10px 0 0; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li{ float: left; cursor:pointer; width: 100px; height: 46px; text-align: center; font-weight: 400; font-size: 14px; color: #222222; position: relative; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li p{ line-height: 45px; padding-top: 1px;}
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li.on{ font-weight: 700; font-size: 14px; color: #FF5C00; background:#ffffff; height: 45px; width: 98px; line-height: 45px;  border-radius: 10px 10px 0 0; border: 1px solid #ffffff; border-bottom: none; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li.on p{background: linear-gradient( 180deg, #FFF6F1 0%, rgba(255,255,255,0) 100%);  padding-top: 0px;}
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li span{ font-weight: normal; display: none; position: absolute; right:2px; top:2px; font-size: 12px; border-radius: 14px; padding: 0 3px; height: 14px; line-height: 14px; color: #fff; background: #ff5c00;  }
.filter-screen .filter-pop .filter-pop-box .juhe-tab ul li.on span{ top: 1px; right: 1px; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab .scroll-left{ display: none; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab .scroll-right{ display: none; }
.filter-screen .filter-pop .filter-pop-box .more-tab{ position: relative; background: #FFF8F4; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-left{ display: block; position: absolute; top: 0; left: 0; z-index: 1; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-left .normal{ display: block; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-left .hover{ display: none; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-left:hover .normal{ display:none; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-left:hover .hover{ display: block; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-right{ display: block; position: absolute; top: 0; right: 0; z-index: 1; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-right .normal{ display: block; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-right .hover{ display: none; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-right:hover .normal{ display:none; }
.filter-screen .filter-pop .filter-pop-box .more-tab .scroll-right:hover .hover{ display: block; }
.filter-screen .filter-pop .filter-pop-box .more-tab ul{ padding: 0 44px; }
.filter-screen .filter-pop .filter-pop-box .more-tab ul li{ width: 90px; position:relative; }
.filter-screen .filter-pop .filter-pop-box .more-tab ul li.on{ width: 88px; background:#FFF8F4; border-color: #FFF8F4; }
.filter-screen .filter-pop .filter-pop-box .more-tab ul li.on::after{ content: ''; position: absolute; bottom: 0; left: 50%; margin-left: -11px; width: 22px; height: 3px; background: #FF5C00; }
.filter-screen .filter-pop .filter-pop-box .juhe-tab .juhe-li{ height: 46px; overflow: hidden; width: 1190px; }

.filter-screen .filter-pop .filter-pop-box .filter-pop-head{ display: flex; justify-content: space-between; align-items: center;  border-bottom: 1px dotted #E5E5E5; }
.filter-screen .pop-head-left{ display: flex; align-items: center; padding: 12px 0; }
.filter-screen .pop-head-left h3{font-weight: 700; font-size: 14px; color: #222222; padding-right: 20px;}
.filter-screen .pop-head-left h3 .agg-item{ margin-right: 30px; cursor: pointer; }
.filter-screen .pop-head-left h3 .agg-item.on{ color:#ff5c00; }
.filter-screen .pop-head-left h3 .agg-item:last-child{ margin-right: 0;  }
.filter-screen .pop-head-left .filter-self{display: flex; align-items: center; position: relative;}
.filter-screen .pop-head-left .filter-self .self-input{ width: 150px; height: 28px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; position: relative; }
.filter-screen .pop-head-left .filter-self .self-input .search-icon{ position: absolute; top:10px; right: 7px; }
.filter-screen .pop-head-left .filter-self .self-input .search-icon img{ display: block; width: 10px; height: 10px; }
.filter-screen .pop-head-left .filter-self .self-input input{ height:28px; width: 120px; padding-left: 8px; border: none; font-weight: 700; color: #222222; }
.filter-screen .pop-head-left .filter-self .self-input input::placeholder{ font-weight: 400; color: #aaaaaa; }
.filter-screen .pop-head-left .filter-self .self-type{ display:flex; align-items: center; padding-left:31px; position: relative; }
.filter-screen .pop-head-left .filter-self .self-type::before{ position: absolute; top: 2px; left: 15px; content: ''; width: 1px; height:26px; background: #D9D9D9; }
.filter-screen .pop-head-left .filter-self .self-type ul{width: 124px; height: 30px; background: #FFFFFF; display:flex; align-items: center;  }
.filter-screen .pop-head-left .filter-self .self-type ul li{ width: 61px; line-height: 28px; text-align: center; cursor:pointer; }
.filter-screen .pop-head-left .filter-self .self-type ul li:first-child{ border: 1px solid #aaaaaa; border-radius: 3px 0px 0 3px; border-right:none; margin: -1px 0 0 -1px; }
.filter-screen .pop-head-left .filter-self .self-type ul li:last-child{ border: 1px solid #aaaaaa; border-radius: 0 3px 3px 0; border-left:none; margin: -1px -1px 0 0; }
.filter-screen .pop-head-left .filter-self .self-type ul li.on{ background:#00A3FF; border-color: #00A3FF; color: #ffffff; }
.filter-screen .pop-head-left .filter-self .self-type p{ margin-left:5px;  visibility: hidden;}
.filter-screen .pop-head-left .filter-self .self-type p input{width: 38px; height: 28px; text-align: center; font-weight: 700; margin: 0 5px; background: #FFFFFF; border-radius:5px; border: 1px solid #CCCCCC;}
.filter-screen .pop-head-left .filter-self .self-type p input:focus{box-shadow: 0px 0px 3px 0px rgba(51,153,255,0.7); border: 1px solid #3399FF}
.filter-screen .pop-head-left .filter-self .self-type.no-all p{ visibility:visible; }
.filter-screen .pop-head-left .filter-self .not-find{ margin-left: 10px; }
.filter-screen .pop-head-left .filter-self .not-find a{ color: #999999; }
.filter-screen .pop-head-left .filter-self .not-find a:hover{ color: #0C80EF; }
.filter-screen .pop-head-right{ display:flex; justify-content: flex-end; align-items: center; padding: 12px 0; }
.filter-screen .pop-head-right .check-btn{  height: 30px; cursor: pointer; line-height: 30px; display:flex;   align-items: center; }
.filter-screen .pop-head-right .check-btn img{ vertical-align: middle; margin-top: -2px; margin-right: 3px; }
.filter-screen .pop-head-right .check-btn .no-check{display: block;}
.filter-screen .pop-head-right .check-btn .has-check{display: none;}
.filter-screen .pop-head-right .check-btn.on .no-check{display: none;}
.filter-screen .pop-head-right .check-btn.on .has-check{display: block;}
.filter-screen .pop-head-right .reset-btn{ width: 80px; height: 30px; background: #EFEFEF; border-radius: 3px; margin: 0 0 0 20px; }
.filter-screen .pop-head-right .reset-btn a{ display:block; width:100%;  height: 100%; text-align: center; line-height: 30px; color: #666666;}
.filter-screen .pop-head-right .sub-btn{ width: 80px; margin-left: 10px; height: 30px; background: #FF5C00; border-radius: 3px; }
.filter-screen .pop-head-right .sub-btn a{ display:block; width:100%;  height: 100%; text-align: center; line-height: 30px; color: #ffffff;}
.filter-screen .agg-filter{ display: none; }
.filter-screen .filter-pop-bottom{ display: flex; align-items: center; padding-bottom: 15px; flex-wrap: wrap;}
.filter-screen .filter-pop-bottom .pop-chose-item{ width: 104px; height: 30px; text-align: center; box-sizing: border-box; margin-top: 15px; margin-right: 10px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; position: relative; }
.filter-screen .filter-pop-bottom .pop-chose-item p{ line-height: 28px; height: 28px; word-break: break-all; overflow: hidden; padding: 0 2px; cursor: pointer; }
.filter-screen .filter-pop-bottom .pop-chose-item:hover{ border-color:#ff5c00; color: #ff5c00;  }
.filter-screen .filter-pop-bottom .pop-chose-item.on{ border-color:#ff5c00; color: #ff5c00; background: #FFEEE4; }
.filter-screen .filter-pop-bottom .pop-chose-item .close-icon{ width:11px; position: absolute; top:-1px; right: -1px; display: none; }
.filter-screen .filter-pop-bottom .pop-chose-item.moreon{ border-color:#ff5c00; color: #ff5c00; background: #FFEEE4; }
.filter-screen .filter-pop-bottom .pop-chose-item.moreon .close-icon{ width:11px; position: absolute; top:-1px; right: -1px; display: block; }
.filter-screen .filter-pop-bottom .pop-chose-item:nth-child(10n){margin-right: 0;}
.filter-screen .filter-chose .price-chose .chose-item{ padding:0 14px; }
.filter-screen .filter-chose .price-input{ display: flex; align-items: center; margin-bottom: 10px; padding-left: 21px; position: relative; }
.filter-screen .filter-chose .price-input .price-item{width: 56px; height: 30px; padding: 0 4px; line-height: 30px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC;}
.filter-screen .filter-chose .price-input .price-item span{ font-size: 12px; color: #CCCCCC; }
.filter-screen .filter-chose .price-input .price-item input{ width:38px; height: 30px; border: none; font-weight: 700; color: #222222; }
.filter-screen .filter-chose .price-input .gud{ padding:0 4px; color: #999999; }
.filter-screen .filter-chose .price-input a{ display: block; width: 54px; margin-left: 7px; height: 30px; text-align: center; line-height: 30px; color: #222222; background: #FAFAFA; border-radius: 3px; border: 1px solid #CCCCCC;}
.filter-screen .filter-chose .price-input::before{ content: ''; position: absolute; top: 5px; left: 5px; width: 1px; height: 24px; background: #D9D9D9;  }
.filter-screen .filter-chose .filter-search{ width: 150px; height: 30px; margin-bottom:10px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; position: relative; }
.filter-screen .filter-chose .filter-search .search-icon{ position: absolute; top:4px; right: 5px; }
.filter-screen .filter-chose .filter-search .search-icon img{ display: block; width:34px; height: 22px; }
.filter-screen .filter-chose .filter-search input{ height:30px; width: 120px; padding-left: 8px; border: none; font-weight: 700; color: #222222; }
.filter-screen .filter-chose .filter-search input::placeholder{ font-weight: 400; color: #aaaaaa; }
.filter-screen .pop-chose-item .item-children{ display: none; width: 340px; background: #333333; border-radius: 8px; position: absolute; top: 32px; left: -147px; padding: 16px 14px 0 14px; z-index: 1;  }
.filter-screen .pop-chose-item .item-children .children-head{ display:flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.filter-screen .pop-chose-item .item-children .children-head .child{ width: 104px; overflow: hidden; height: 18px; text-align: left; margin-bottom: 14px; cursor: pointer; line-height: 18px;color: #ffffff; }
.filter-screen .pop-chose-item .item-children .children-head .child img{ vertical-align: middle; margin-top: -2px; margin-right: 5px; }
.filter-screen .pop-chose-item .item-children .children-head .child .no-check{display: inline-block;}
.filter-screen .pop-chose-item .item-children .children-head .child .has-check{display: none;}
.filter-screen .pop-chose-item .item-children .children-head .child.on .no-check{display: none;}
.filter-screen .pop-chose-item .item-children .children-head .child.on .has-check{display: inline-block;}
.filter-screen .pop-chose-item .item-children .children-bottom{ display:flex; justify-content: space-between; align-items: center; padding: 13px 0; border-top: 1px dotted #555555; }
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose{ overflow: hidden; height: 18px; cursor: pointer; line-height: 18px; display:flex;   align-items: center; color: #ffffff; }
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose img{ vertical-align: middle; margin-top: -2px; margin-right: 5px; }
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose .no-check{display: block;}
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose .has-check{display: none;}
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose.on .no-check{display: none;}
.filter-screen .pop-chose-item .item-children .children-bottom .all-chose.on .has-check{display: block;}
.filter-screen .pop-chose-item .item-children .children-bottom a{ color:#ffffff; margin-left:20px; }
.filter-screen .filter-pop-btn{ padding-top: 10px; border-top: 1px dotted #e5e5e5; }
.filter-screen .filter-pop-btn a{ display: block; line-height: 36px; margin: 0 auto; text-align: center; font-size: 14px; color: #ffffff; width: 200px; height: 36px; background: #FF5C00; border-radius: 6px;}
.filter-screen .filter-input{ display: flex; align-items: center; margin-top: 15px; }
.filter-screen .filter-input p{margin-right: 10px;}
.filter-screen .filter-input input{ width: 68px; font-weight: 700; color: #222222; height: 30px; padding: 0 5px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; }
.filter-screen .filter-input input::placeholder{ color: #CCCCCC; font-weight: 400; }
.filter-screen .filter-input em{ color: #999999; padding: 0 4px;  }
.filter-screen .filter-input .self-sub{margin-left: 8px; width: 56px; height: 32px; line-height: 32px; color: #ffffff; background: #FF5C00; text-align: center; border-radius: 3px; }
.filter-screen .filter-input .self-reset{margin-left: 8px; width: 56px; height: 32px; line-height: 32px; color: #666666; background: #efefef; text-align: center; border-radius: 3px; }
.filter-list{ margin-top: 15px; width: 1190px; background: #ffffff;  border-radius: 10px; }
.filter-list .list-head{ height: 40px; display: flex; justify-content: space-between; align-items: center; background: linear-gradient( 135deg, #FFF4EE 0%, #FFFCF9 100%); border-radius: 10px 10px 0 0; }
.filter-list .list-head ul{border-radius: 10px 10px 0 0; }
.filter-list .list-head ul li{ float: left; cursor:pointer; width: 88px; height: 40px; text-align: center; font-weight: 400; font-size: 14px; color: #222222; position: relative;}
.filter-list .list-head ul li p{ line-height: 39px; padding-top: 1px; }
.filter-list .list-head ul li.on{ font-weight: 700; font-size: 14px; color: #FF5C00; background:#ffffff; height: 39px; width: 86px; line-height: 39px;  border-radius: 10px 10px 0 0; border: 1px solid #ffffff; border-bottom: none;}
.filter-list .list-head ul li.on p{background: linear-gradient( 180deg, #FFF6F1 0%, rgba(255,255,255,0) 100%); padding-top: 0px;}
.filter-list .list-head ul li.on p span{padding: 0 8px; background: url(../../images/common/search-tit-icon.png) no-repeat bottom right; background-size: 5px; }
.filter-list .list-head ul li .jb-tags{ position: absolute; right: 0; top: -7px; }
.filter-list .list-head .right-filter{ padding-right: 20px; display: flex; align-items: center; }
.filter-list .list-head .right-filter .get-yongjin{ display: flex; align-items: center; padding-right: 10px; }
.filter-list .list-head .right-filter .get-yongjin .yjto{ display: block; }
.filter-list .list-head .right-filter .get-yongjin .yjtohov{ display: none; }
.filter-list .list-head .right-filter .get-yongjin:hover .yjto{ display: none; }
.filter-list .list-head .right-filter .get-yongjin:hover .yjtohov{ display: block; }
.filter-list .list-head .right-filter .get-yongjin span{ color: #666; }
.filter-list .list-head .right-filter .get-yongjin span em{ color:#FF5C00; }
.filter-list .list-head .right-filter .list-dh{  position: relative; padding-left: 11px; padding-right: 10px; }
.filter-list .list-head .right-filter .list-dh a{color: #3399FF;}
.filter-list .list-head .right-filter .list-dh a:hover{ text-decoration: underline; }
.filter-list .list-head .right-filter .list-dh::before{ content: ''; width: 1px; height: 12px; position: absolute; left: 0; top: 3px; background: #E8E2DC; }
.filter-list .list-head .right-filter .list-change{  position: relative; padding-left: 11px; }
.filter-list .list-head .right-filter .list-change a{color: #3399FF;}
.filter-list .list-head .right-filter .list-change a:hover{ text-decoration: underline; }
.filter-list .list-head .right-filter .list-change::before{ content: ''; width: 1px; height: 12px; position: absolute; left: 0; top: 3px; background: #E8E2DC; }
.filter-list .list-head .right-filter .list-change .change-tip{ font-size: 12px; color: #FFFFFF; line-height: 28px; padding-left: 38px; box-sizing: border-box; position: absolute; top: -36px; left: 50%; z-index: 3; margin-left: -109px; width: 218px; height: 36px; background: url(../../images/list-2024/change-view.png) no-repeat; background-size: 218px; }
.filter-list .list-head .right-filter .list-change .change-tip .closei{ position: absolute; width: 14px; height: 14px; top: 7px; right: 8px; cursor: pointer; }
.filter-list .list-bot{ display: flex; align-items: center; justify-content: space-between; height: 50px; box-sizing: border-box; background: #ffffff; border-radius: 0 0 10px 10px; padding:0 20px; }
.filter-list .list-bot ul li{ position: relative; float: left; color: #222222; margin-right: 10px; width: 70px; height: 24px; box-sizing: border-box; line-height: 22px; text-align: center; cursor: pointer; background: #FAFAFA; border-radius:  3px; border: 1px solid #CCCCCC; }
.filter-list .list-bot ul li.on{background: #FF5C00; color: #ffffff; border-color: #ff5c00; }
.filter-list .list-bot ul li .litter{ position:absolute; top: -13px; left: 20px; z-index: 2; animation: shake 1s linear 0s infinite alternate;}
.filter-list .list-bot .list-page{ display:flex; align-items: center; }
.filter-list .list-bot .list-page span{ margin-left: 10px; }
.filter-list .list-bot .list-page span input{width: 26px; margin: 0 4px; text-align: center; font-weight: 700; color: #222222; height: 26px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC;}
.filter-list .list-bot .list-page a{ display: block; text-align: center; margin-left: 4px; width: 42px; height: 26px; line-height: 26px; background: #FFFFFF; border-radius: 3px; border: 1px solid #CCCCCC; }
.list-box{ width:1190px; margin-top: 2px; padding: 0 30px; box-sizing: border-box; background:#FFFFFF; border-radius: 10px; }
.list-box .list-item{ padding:20px 0; border-bottom: 1px dotted #E5E5E5; display: flex; flex-wrap: wrap;}
.list-box .list-item:last-child{ border: none; }
.list-box .list-item .list-left{ width: 500px; height: 278px; position: relative; }
.list-box .list-item .list-left .list-pic{ width:500px; height: 278px; border-radius: 10px; background: #333333; overflow: hidden; text-align: center; }
.list-box .list-item .list-left .list-pic img{ width:100%; height: auto; object-fit: cover; }
.list-box .list-item .list-left .recommed-icon{ position:absolute; bottom: 0; right: 0; }
.list-box .list-item .list-left .pic-num{ position:absolute; min-width: 40px; border-radius: 0 10px 0 10px; height: 26px; line-height: 26px; text-align: center;  bottom: 0; left: 0; background-color: rgba(0,0,0,.6); color: #ffffff; font-size: 14spx; }
.list-box .list-item .list-right{ margin-left: 25px; width: 605px; position: relative; }
.list-box .list-item .list-right h3.title{max-height: 60px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; text-overflow: ellipsis; font-weight: 700; font-size: 16px; color: #222222; line-height: 20px; }
.list-box .list-item .list-right h3.title a{ color: #222222; }
.list-box .list-item .list-right h3.title a:hover{ color: #FF5C00; }
.list-box .list-item .list-right h3.two-line{ max-height:40px; -webkit-line-clamp: 2;}
.list-box .list-item .list-right h3.four-line{ max-height:80px; -webkit-line-clamp: 4;}
.list-box .list-item .list-right .tags-box{ display:flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.list-box .list-item .list-right .tags-box .tag-item{ display:flex; align-items: center; }
.list-box .list-item .list-right .tags-box .tag-item span{margin-right: 5px; }
.list-box .list-item .list-right .tags-box .tag-item span img{ display:block; height: 18px; }
.list-box .list-item .list-right .tags-box .tag-item .xjb-box{ margin-right: 5px; display: flex; align-items: center; border-radius: 3px; border: 1px solid #ff5c00; }
.list-box .list-item .list-right .tags-box .tag-item .xjb-box img{ background:#FFEEE4; padding: 3px 4px; border-radius: 3px 3px 0 0; }
.list-box .list-item .list-right .tags-box .tag-item .xjb-box em{ color: #ff5c00; font-size: 12px; padding: 0 2px; line-height: 16px; }
.list-box .list-item .list-right .tags-box .tag-item .hot-box{ margin-right: 5px; display: flex; align-items: center; border-radius: 3px; padding: 0 2px; background: #FFF1BC; }
.list-box .list-item .list-right .tags-box .tag-item .hot-box img{ padding: 1px 0;}
.list-box .list-item .list-right .tags-box .tag-item .hot-box em{ color: #ff5c00; font-family: Impact; font-size: 12px; padding: 0 2px; line-height: 18px; }
.list-box .list-item .list-right .tags-box p{font-weight: 400; font-size: 14px; color: #01C25A;}
.list-box .list-item .list-right .tags-box p.sell-offline{ color:#999999; }
.list-box .list-item .list-right .server-price{ display:flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.list-box .list-item .list-right .server-price .server-box p{ line-height:22px; font-size: 13px; }
.list-box .list-item .list-right .server-price .server-box p img{ height: 16px; vertical-align: middle; margin-top: -2px; margin-left: 5px; }
.list-box .list-item .list-right .server-price .price-box{ text-align: center; }
.list-box .list-item .list-right .server-price .price-box h4{ font-weight: 700; font-size: 25px; line-height: 32px; color: #FF5C00; margin-top: -14px; }
.list-box .list-item .list-right .server-price .price-box h4 span{ font-weight: 400; font-size: 16px; vertical-align: text-top; color: #999999; text-decoration-line: line-through; margin-right: 10px; }
.list-box .list-item .list-right .server-price .time-limit{ text-align: right; }
.list-box .list-item .list-right .server-price .time-limit p{ text-align: center; font-weight: 400; font-size: 16px; line-height: 19px; color: #999999; text-decoration-line: line-through;  }
.list-box .list-item .list-right .server-price .time-limit img{ width: 77px; margin-top: 3px; }
.list-box .list-item .list-right .server-price .red-box{ padding: 2px 5px 2px 10px; position:relative; display: inline; color: #fff; line-height: 16px; text-align: center; border-radius: 3px;  background: linear-gradient( 90deg, #FFA100 0%, #F22922 100%);}
.list-box .list-item .list-right .server-price .red-box .red-icon{ position:absolute; bottom: -5px; left: -15px; }
.list-box .list-item .list-right .attr-box{ height: 56px; background: #FFF6F1; border-radius:5px; margin-top: 8px; display: flex; align-items: center; justify-content: space-around; }
.list-box .list-item .list-right .attr-box .attr-item{ text-align:center;}
.list-box .list-item .list-right .attr-box .attr-item h4{font-weight: 700; font-size: 16px; height: 24px; line-height: 24px; overflow: hidden; color: #222222;}
.list-box .list-item .list-right .attr-box .attr-item p{font-weight: 400; font-size: 12px; color: #888888;}
.list-box .list-item .list-right .btn-area{ position: absolute; width: 100%; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; }
.list-box .list-item .list-right .btn-area .collect a{ color: #666666; }
.list-box .list-item .list-right .btn-area .collect a img{ vertical-align: middle; margin: -4px 4px 0 0;  }
.list-box .list-item .list-right .btn-area .btn-box a{margin-left:10px; }
.list-box .list-item .yxsj-box{ width: 1130px; height: 50px; display: flex; justify-content: space-between; align-items: center; background: linear-gradient( 360deg, #FFFFFF 0%, #FFE6D9 100%); border-radius: 10px 10px 0 0; }
.list-box .list-item .yxsj-box .yxsj-left .yxsj-icon{ vertical-align: middle; margin: -14px 5px 0 8px; }
.list-box .list-item .yxsj-box .yxsj-left .yxsj-title{ vertical-align: middle; margin-top: -4px; }
.list-box .list-item .yxsj-box .yxsj-right{ display: flex; align-items:center; padding-right: 20px; }
.list-box .list-item .yxsj-box .yxsj-right p{position: relative; display: flex; margin-left: 26px; align-items: center; }
.list-box .list-item .yxsj-box .yxsj-right p img{ margin-left: 4px; }
.list-box .list-item .yxsj-box .yxsj-right p i { position: absolute; top: 14px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item .yxsj-box .yxsj-right p:hover i{ display: block; }
.list-box .list-item .pztj-box{ width: 1130px; height: 54px; background:url(../../images/list-2024/pztj-b-bg.png) no-repeat; background-size: 100%; }
.list-box .list-item .pztj-box p{position: relative; float: right; margin: 21px 22px 0 0; }
.list-box .list-item .pztj-box p i { position: absolute; top: 14px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item .pztj-box p:hover i{ display: block; }
.list-box .list-item.best-goods{ width: 1130px; height: 354px; padding: 20px 14px; margin-left: -14px; background: url(../../images/list-2024/list-b-bg.png) no-repeat; background-position: 0 20px; background-size: 100%; }
.list-box .list-item.best-goods.hascd{ width: 1130px; height: 354px; padding: 20px 14px; margin-left: -14px; background: url(../../images/list-2024/list-b-a-bg.png) no-repeat; background-position: 0 20px; background-size: 100%; }
.list-box .list-item.best-goods .pztj-best{ width: 1130px; height:40px; }
.list-box .list-item.best-goods .pztj-best p{position: relative; float: right; margin:22px 5px 0 0; width: 16px; height: 16px; }
.list-box .list-item.best-goods .pztj-best p i { position: absolute; top: 16px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item.best-goods .pztj-best p:hover i{ display: block; }
.list-box .list-item.best-goods .list-right .attr-box{ background: #ffffff; }
.list-box .list-item.best-goods .list-right .btn-area{ bottom: 20px; }
.list-box .list-item.best-goods .list-right .btn-area .btn-com-01:hover{ color: #5A70FF; border-color: #5A70FF; }
.list-box .list-item.best-goods .list-right .btn-area .btn-com-01.color01{ color: #ffffff; background: linear-gradient( 90deg, #3072FF 0%, rgba(134,81,255,0.8) 100%); }
.list-box .list-item.best-goods .list-right .btn-area .btn-com-01.color01:hover{ color: #ffffff; background: linear-gradient( 270deg, #3072FF 0%, rgba(134,81,255,0.8) 100%); }

.list-box .list-item-default{display: flex; flex-wrap: wrap; align-items: center; padding: 20px 10px; border-bottom: 1px dotted #E5E5E5; justify-content: space-between; position: relative;}
.list-box .list-item-default.recomd{ position: relative; background: linear-gradient( 90deg, #FFFFFF 0%, #FFF6EB 100%); margin: 0 -30px 0  -30px; padding: 20px 40px; }
.list-box .list-item-default.recomd::before{ content:''; width: 30px; height: 1px; background: #fff; position: absolute; left: 0; bottom: -1px; }
.list-box .list-item-default.recomd::after{ content:''; width: 30px; height: 1px; background: #fff; position: absolute; right: 0; bottom: -1px; }
.list-box .list-item-default .recomd-icon{ position: absolute; bottom: 0; right: 0; }
.list-box .list-item-default:last-child{ border: none; }
.list-box .list-item-default .list-title-box{width: 540px; }
.list-box .list-item-default .list-title-box h3{ font-weight: 700; line-height: 20px; font-size: 15px; margin-bottom: 1px; color: #222222; max-height: 40px; overflow: hidden; }
.list-box .list-item-default .list-title-box h3 img{ vertical-align: middle; margin-top: -4px; height: 18px; }
.list-box .list-item-default .list-title-box h3 a{ color: #222222; }
.list-box .list-item-default .list-title-box h3 a:hover{ color: #ff5c00; }
.list-box .list-item-default .list-title-box h3 span{ margin-right: 5px; }
.list-box .list-item-default .list-title-box h3 span:last-child{ margin-right: 0; }
.list-box .list-item-default .list-title-box p{ font-size: 12px; color: #666666; line-height: 16px; padding-top: 8px; color: #666666; }
.list-box .list-item-default .list-title-box p .stock{ padding-left: 21px; position: relative; }
.list-box .list-item-default .list-title-box p .stock::before{ content: ''; width: 1px; height: 12px; background: #D9D9D9; position: absolute; top: 2px; left: 10px; }
.list-box .list-item-default .list-title-box p .stock em{ color: #3399FF; font-weight: 700; }
.list-box .list-item-default .list-title-box p img{ height: 16px; vertical-align: middle; margin: -2px 0 0 3px; }
.list-box .list-item-default .price-box{ text-align: center; width: 150px; }
.list-box .list-item-default .price-box h3{font-size: 20px; font-weight: 700; color: #FF5C00; line-height: 24px;}
.list-box .list-item-default .price-unit{ width: 270px; text-align: center; }
.list-box .list-item-default .price-unit p{ font-size: 13px; }
.list-box .list-item-default .price-unit p em{ color: #ff5c00; font-weight: 700; }
.list-box .list-item-default .btn-box{ width: 120px; text-align: center; position: relative; z-index: 2; }
.list-box .list-item-default .btn-box .btn-com-01{ width: 110px; height: 36px; line-height: 36px; font-size: 13px; }
.list-box .list-item-default .btn-box p{ line-height: 16px; margin-top:4px; }
.list-box .list-item-default .btn-box p span{ color:#ff5c00; padding: 0 3px; }
.list-box .list-item-default .btn-box .jiang-icon{ position: absolute; top:0; left: -44px; cursor: pointer; }
.list-box .list-item-default .list-title-box p .stock em.sellstar{margin: -4px 2px 0 0; display: inline-block; *display: inline; *zoom: 1; width: 16px; height: 16px; background: url("../../images/goods-details/storedj.png") no-repeat; vertical-align: middle;}
.list-box .list-item-default .list-title-box p .stock em.sellstar.kinghat{ background: url("../../images/goods-details/kinghat.gif") no-repeat;}
.list-box .list-item-default .list-title-box p .stock em.sellstar.diamond{ background: url("../../images/goods-details/diamond.gif") no-repeat;}
.list-box .list-item-default .list-title-box p .stock em.sellstar.startall{background-position:-1px -39px;}
.list-box .list-item-default .list-title-box p .stock em.sellstar.starthalf{background-position:-1px -62px;}
.list-box .list-item-default .list-title-box p .stock em.sellstar.startnone{background-position:-1px -84px;}
.list-box .list-item-small{ padding:20px 0; display: flex; flex-wrap: wrap; border-top: 1px dotted #E5E5E5;}
.list-box .list-item-small:last-child{}
.list-box .list-item-small .yxsj-box{ width: 1130px; height: 42px; display: flex; justify-content: space-between; align-items: center; background: linear-gradient( 360deg, #FFFFFF 0%, #FFE6D9 100%); border-radius: 10px 10px 0 0; }
.list-box .list-item-small .yxsj-box .yxsj-left .yxsj-icon{ vertical-align: middle; margin: -5px 2px 0 12px; }
.list-box .list-item-small .yxsj-box .yxsj-left .yxsj-title{ vertical-align: middle; margin-top: -4px; }
.list-box .list-item-small .yxsj-box .yxsj-right{ display: flex; align-items:center; padding-right: 20px; }
.list-box .list-item-small .yxsj-box .yxsj-right p{position: relative; display: flex; margin-left: 26px; align-items: center; }
.list-box .list-item-small .yxsj-box .yxsj-right p img{ margin-left: 4px; }
.list-box .list-item-small .yxsj-box .yxsj-right p i { position: absolute; top: 14px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item-small .yxsj-box .yxsj-right p:hover i{ display: block; }
.list-box .list-item-small .pztj-box{ width: 1130px; height: 50px; margin-bottom: 5px; background: url(../../images/list-2024/pztj-bg.png) no-repeat; background-size: 100%; }
.list-box .list-item-small .pztj-box p{position: relative; float: right; margin: 21px 22px 0 0; }
.list-box .list-item-small .pztj-box p i { position: absolute; top: 14px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item-small .pztj-box p:hover i{ display: block; }
.list-box .list-item-small .list-small-left{ width: 288px; height: 160px; position: relative; }
.list-box .list-item-small .list-small-left .list-pic{ width:288px; height: 160px; border-radius: 10px; background: #333333; overflow: hidden; text-align: center; }
.list-box .list-item-small .list-small-left .list-pic img{ width:100%; height: auto; object-fit: cover; }
.list-box .list-item-small .list-small-left .recommed-icon{ position:absolute; bottom: 0; right: 0; }
.list-box .list-item-small .list-small-left .pic-num{ position:absolute; min-width: 36px; border-radius:0 10px 0 10px; height: 24px; line-height: 24px; text-align: center;  bottom: 0; lefts: 0; background-color: rgba(0,0,0,.6); color: #ffffff; font-size: 12px; }
.list-box .list-item-small .list-small-left .pic-hover{display: none; background: linear-gradient( 180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.9) 100%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 10px; }
.list-box .list-item-small .list-small-left .hover-btn{ padding-top: 108px; display: flex; align-items: center; justify-content: center; }
.list-box .list-item-small .list-small-left .hover-btn a{ border-radius: 45px; margin: 0 15px; width: 90px; height: 28px; line-height: 28px; text-align: center; font-size: 12px; color: #FFFFFF; }
.list-box .list-item-small .list-small-left .hover-btn a.look-big{background: linear-gradient( 270deg, #FF5C00 0%, #FF9900 100%); box-shadow: 0px 5px 15px 0px rgba(255,124,0,0.7); }
.list-box .list-item-small .list-small-left .hover-btn a.to-detail{background:linear-gradient( 135deg, #30AAFF 0%, #3072FF 100%); box-shadow: 0px 5px 15px 0px rgba(48,145,255,0.7); }
.list-box .list-item-small .list-small-right{ margin-left: 20px; width: 822px; position: relative; }
.list-box .list-item-small .list-small-right h3.title{max-height: 40px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; font-weight: 700; font-size: 16px; color: #222222; line-height: 20px; }
.list-box .list-item-small .list-small-right h3.title a{ color: #222222; }
.list-box .list-item-small .list-small-right h3.title a:hover{ color: #FF5C00; }
.list-box .list-item-small .list-small-right h3.three-line{ max-height:60px;-webkit-line-clamp: 3; }
.list-box .list-item-small .list-small-right h3.four-line{ max-height:80px; -webkit-line-clamp: 4;}
.list-box .list-item-small .list-small-right .right-bottom{ display: flex; justify-content: space-between; align-items: center; }
.list-box .list-item-small .list-small-right .right-bottom .right-bot-left{ width: 650px; }
.list-box .list-item-small .list-small-right .tags-box{ display:flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.list-box .list-item-small .list-small-right .tags-box .tag-item{ display:flex; align-items: center; }
.list-box .list-item-small .list-small-right .tags-box .tag-item span{margin-right: 5px; }
.list-box .list-item-small .list-small-right .tags-box .tag-item span img{ display:block; height: 18px; }
.list-box .list-item-small .list-small-right .tags-box .tag-item .xjb-box{ margin-right: 5px; display: flex; align-items: center; border-radius: 3px; border: 1px solid #ff5c00; }
.list-box .list-item-small .list-small-right .tags-box .tag-item .xjb-box img{ background:#FFEEE4; padding: 3px 4px; border-radius: 3px 3px 0 0; }
.list-box .list-item-small .list-small-right .tags-box .tag-item .xjb-box em{ color: #ff5c00; font-size: 12px; padding: 0 2px; line-height: 16px; }
.list-box .list-item-small .list-small-right .tags-box .tag-item .hot-box{ margin-right: 5px; display: flex; align-items: center; border-radius: 3px; padding: 0 2px; background: #FFF1BC; }
.list-box .list-item-small .list-small-right .tags-box .tag-item .hot-box img{ padding: 1px 0;}
.list-box .list-item-small .list-small-right .tags-box .tag-item .hot-box em{ color: #ff5c00; font-family: Impact; font-size: 12px; padding: 0 2px; line-height: 18px; }
.list-box .list-item-small .list-small-right .server-box{ display:flex; align-items: center; margin-top: 12px; }
.list-box .list-item-small .list-small-right .server-box p{ line-height:18px; font-size: 13px; }
.list-box .list-item-small .list-small-right .server-box em{ color: #D9D9D9; padding: 0 10px; }
.list-box .list-item-small .list-small-right .server-box p.sell-online{ color:#01C25A; }
.list-box .list-item-small .list-small-right .server-box p img{ height: 16px; vertical-align: middle; margin-top: -2px; margin-left: 5px; }
.list-box .list-item-small .list-small-right .attr-collect{ display: flex;  align-items: center; margin-top: 12px; }
.list-box .list-item-small .list-small-right .attr-content{ width: 540px; height: 48px; }
.list-box .list-item-small .list-small-right .attr-box{ display: flex; align-items: center; width: 540px; height: 48px; flex-wrap: wrap; overflow: hidden; }
.list-box .list-item-small .list-small-right .attr-box .attr-item{ height:48px; background: #FFF6F1; text-align: center; min-width: 60px; padding: 0 5px; }
.list-box .list-item-small .list-small-right .attr-box .attr-item h4{font-weight: 700; font-size: 12px; color: #222222; line-height: 16px; padding-top: 7px; }
.list-box .list-item-small .list-small-right .attr-box .attr-item p{font-weight: 400; font-size: 12px; color: #666666; line-height: 16px; padding-top: 2px; }
.list-box .list-item-small .list-small-right .collect{ margin-left: 15px; }
.list-box .list-item-small .list-small-right .collect a{ color: #666666; }
.list-box .list-item-small .list-small-right .collect a img{ vertical-align: middle; margin: -4px 4px 0 0;  }
.list-box .list-item-small .list-small-right .right-bot-right{ flex-grow: 1; display: flex; justify-content:flex-end; align-items: flex-end; height: 120px;  }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area{ display: inline-block; text-align: center; min-width: 120px; }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area a{ height: 34px; line-height: 34px; font-size: 14px; }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area h4 {font-weight: 700; font-size: 20px; padding: 2px 0; line-height: 28px; color: #FF5C00;}
.list-box .list-item-small .list-small-right .right-bot-right .btn-area .red-box { padding: 2px 5px 2px 10px; position: relative; display: inline; color: #fff; line-height: 16px; text-align: center; border-radius: 3px; background: linear-gradient(90deg, #FFA100 0%, #F22922 100%); }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area .red-box .red-icon { position: absolute; bottom: -5px; left: -15px; }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area .time-limit{ }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area .time-limit p{ text-align: center; font-weight: 400; font-size: 14px; line-height: 14px; color: #999999; text-decoration-line: line-through;  }
.list-box .list-item-small .list-small-right .right-bot-right .btn-area .time-limit img{ width: 77px; margin-top: 3px; }

.list-box .list-item-small.best-goods{ width: 1130px; height: 236px; padding: 20px 14px 0 14px; border-top: none; margin-left: -14px; background: url(../../images/list-2024/list-s-bg.png) no-repeat; background-position: 0 20px; background-size: 100%; }
.list-box .list-item-small.best-goods.hascd{ width: 1130px; height: 236px; padding: 20px 14px 0 14px; margin-left: -14px; background: url(../../images/list-2024/list-s-a-bg.png) no-repeat; background-position: 0 20px; background-size: 100%; }
.list-box .no-calss .best-goods:last-child{ padding-bottom: 20px; }
.list-box .list-item-small.best-goods .pztj-best{ width: 1130px; height:40px; }
.list-box .list-item-small.best-goods .pztj-best p{position: relative; float: right; margin:22px 5px 0 0; width: 16px; height: 16px; }
.list-box .list-item-small.best-goods .pztj-best p i { position: absolute; top: 16px; right: 0px; width: 180px; padding: 8px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1); border-radius: 3px 3px 3px 3px;  border: 1px solid #EEEEEE; z-index: 2; display: none;}
.list-box .list-item-small.best-goods .pztj-best p:hover i{ display: block; }
.list-box .list-item-small.best-goods .list-small-right .attr-box .attr-item{ background: #ffffff; }
.list-box .list-item-small.best-goods .list-small-right .right-bot-right .btn-area .btn-com-01.color01{ color: #ffffff; background: linear-gradient( 90deg, #3072FF 0%, rgba(134,81,255,0.8) 100%); }
.list-box .list-item-small.best-goods .list-small-right .right-bot-right .btn-area .btn-com-01.color01:hover{ color: #ffffff; background: linear-gradient( 270deg, #3072FF 0%, rgba(134,81,255,0.8) 100%); }

.list-box .list-dl-item{ padding: 19px 0; border-top: 1px dotted #E5E5E5; display: flex; flex-wrap: wrap; position: relative; }
.list-box .list-dl-item:last-child{ padding-bottom: 20px; }
.list-box .list-dl-item .list-left{ width: 234px; height: 130px; border-radius: 10px; overflow: hidden; text-align: center; }
.list-box .list-dl-item .list-left img{ width: 100%; height: auto;  object-fit: cover; }
.list-box .list-dl-item .list-right{ margin-left: 20px; width: 876px; position: relative; }
.list-box .list-dl-item .list-right h3.title { max-height: 40px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; font-weight: 700; font-size: 16px; color: #222222; line-height: 20px; }
.list-box .list-dl-item .list-right h3.title a{ color: #222222; }
.list-box .list-dl-item .list-right h3.title a:hover{ color: #ff5c00; }
.list-box .list-dl-item .list-right .right-bot .tag-item { display: flex; align-items: center; margin-top: 12px; }
.list-box .list-dl-item .list-right .right-bot .tag-item span{ margin-right: 5px; }
.list-box .list-dl-item .list-right .right-bot .tag-item span img{ height: 18px; display: block; }
.list-box .list-dl-item .list-right .right-bot .server-box{ margin-top: 12px; }
.list-box .list-dl-item .list-right .right-bot .server-box p{ display: flex; align-items: center; }
.list-box .list-dl-item .list-right .right-bot .server-box p em{ color: #D9D9D9; padding: 0 10px; }
.list-box .list-dl-item .list-right .right-bot .server-box p .blue{ font-weight: 700; }
.list-box .list-dl-item .list-right .right-bot .server-box p .online{ color: #01C25A; }
.list-box .list-dl-item .list-right .right-bot .server-box p span img{ height: 16px; vertical-align: middle; margin: -4px 0 0 5px; }
.list-box .list-dl-item .list-right .right-bot .bot-right{ position: absolute; right: 0; bottom: 7px; width: 120px; text-align: center; }
.list-box .list-dl-item .list-right .right-bot .bot-right h4{ font-size: 22px; color: #FF5C00; font-weight: 600; line-height: 28px; }
.list-box .list-dl-item .list-right .right-bot .bot-right a{ width: 120px; height: 34px; color: #FF5C00; font-size: 14px; margin-top: 8px; background: #FFEEE4; border-radius: 8px; line-height: 32px; box-sizing: border-box; border: 1px solid #FF5C00; }
.list-box .list-dl-item .list-right .right-bot .bot-right a:hover{ color: #fff; border: none; line-height: 34px; background: #ff5c00; background: linear-gradient(270deg, #FF5C00 0%, #FF9900 100%); }
.list-box .list-dl-item.safe-goods{ width: 1130px; height: 206px; border: none; align-items: flex-start; padding: 20px 14px 0 14px; margin-left: -14px; background: url(../../images/list-2024/safe-goods-bg.png) no-repeat; background-position: 0 20px; background-size: 100%; }
.list-box .no-class .safe-goods:last-child{ padding-bottom: 20px; }
.list-box .list-dl-item.safe-goods .safe-title{ width: 1130px; height:27px; padding: 14px 0 3px 0; display: flex; align-items: center; justify-content: flex-end; }
.list-box .list-dl-item.safe-goods .safe-title img{ height: 20px; margin-left: 24px; }

.list-box .list-loading{ height: 700px; padding-top: 40px; }
.list-box .list-loading p{ text-align: center; font-size: 14px; line-height: 28px; padding-top: 8px; }
.list-shop{margin-top: 15px; position: relative; z-index: 1; }
.gold-bg{width:1190px; margin: 0 auto; min-height: 150px; background:linear-gradient(to right,#BD5DFF,#30AAFF); border-radius: 10px; }
.gold-shop{ min-height: 150px; padding-bottom: 10px;}
.gold-shop .sp-tit{color: #fff; font-size: 18px; font-weight: bold; display: flex; align-items: center; justify-content: space-between; font-family:  "PingFang,microsoft yahei"; line-height: 24px; padding:12px 0 4px 20px;}
.gold-shop .sp-tit .tit img{ width:429px; vertical-align:middle;}
.gold-shop .sp-tit span{font-size: 12px; font-weight: normal; margin-left:10px;}
.gold-shop .sp-tit .r{font-size: 12px; color: #fff; padding-right: 15px; }
.gold-shop .sp-tit .r a{color: #fff; font-weight: normal; padding: 0 15px 0 5px;}
.gold-shop .sp-tit .r a img{vertical-align: middle; margin-right: 4px; margin-top: -4px; }
.gold-shop .sp-tit .r span{padding:0 20px; color: #ccc;}
.shop-list{width: 98%; margin: 8px auto 0 auto; border-radius: 5px; background: #fff; min-height: 150px; box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);}
.dnf-shop .shop-list{width: 100%;}
.shop-list .splist-tit{height: 40px; background: #fbfbfb; border-bottom: 1px solid #eee; border-radius: 5px 5px 0 0; line-height: 40px; font-family:PingFang, "microsoft yahei";}
.shop-list .splist-tit .s-01{margin-left: 156px;}
.shop-list .splist-tit .s-02{margin-left: 184px;}
.shop-list .splist-tit .s-03{margin-left: 196px;}
.shop-list .splist-tit .r{padding-right: 20px;}
.shop-list .splist-tit .r label{margin-right: 18px;}
.shop-list .splist-tit .r input{vertical-align: middle; margin-right: 3px;}
.gold-shop .com-page{margin: 20px auto; text-align: center;}
.gold-shop .com-page .page-con{float: none; margin: 0;}
.shop-list{width: 98%; margin: 8px auto 0 auto; border-radius: 5px; background: #fff; min-height: 150px; box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);}
.shop-order{padding: 0 20px}
.shop-item { display:table; width: 100%; min-height:90px; padding: 5px 0; border-bottom: #e8e8e8 1px dashed; position: relative; z-index: 8;}
.shop-item:last-child { border-bottom: none;}
.shop-item-box {vertical-align:middle; display:table-cell; *position:absolute; *top:50%;}
.shop-v { display:inline-block; vertical-align: middle; *display: inline; *zoom:1; *position:relative; *top:-50%; }
.shop-item .part-01 { width: 300px; margin-right: 0; }
.shop-item .part-01 dl dt { width: 74px; height: 75px; float: left; margin-right: 8px; text-align:center; font-family:  "PingFang,microsoft yahei"; display: table;}
.shop-item .part-01 dl dt img{ width: 60px; margin-top: 6px; }
.shop-item .part-01 dl dd { padding-top: 13px;}
.shop-item .part-01 dl dd h4{font-size: 14px; font-weight: bold; color: #333; margin-bottom: 5px; font-family:  "PingFang,microsoft yahei"; height: 20px; line-height: 20px;}
.shop-item .part-01 dl dd h4 span{display: inline-block; max-width: 140px; overflow:hidden; height: 20px; line-height: 20px; float: left;}
.shop-item .part-01 dl dd h4 em{display: inline-block; float: left; margin-left: 10px; margin-top: 2px; color: #fff; font-size: 12px; padding: 0 4px; height: 16px; line-height: 16px;}
.shop-item .part-01 dl dd h4 em.lmem{background: #2455a0;}
.shop-item .part-01 dl dd h4 em.blem{background: #e50b09;}
.shop-item .part-01 dl dd h4 img{ height: 16px; vertical-align: middle; margin-left: 5px; }
.shop-item .part-01 dl dd p { color: #999; font-family:  "PingFang,microsoft yahei";}
.shop-item .part-01 dl dd p span{ color: #ff5c00; padding: 0 5px;}
.shop-item .part-02 { width:185px; text-align: center; margin-right:5px;}
.shop-item .part-02 h3{font-family:  "PingFang,microsoft yahei"; color: #666; font-size: 12px; line-height: 24px;}
.shop-item .part-02 h3 span{color: #ff5c00; font-weight: bold; font-size: 16px;}
.shop-item .part-02 h3 em{color: #ff5c00;}
.shop-item .part-03 { width: 210px; margin-right:5px;}
.shop-item .part-03 .l{width: 60px; line-height: 24px; font-family:  "PingFang,microsoft yahei";}
.shop-item .part-03 .l input{vertical-align: middle; margin-right: 3px;}
.shop-item .part-03 .r{width: 138px; font-family:  "PingFang,microsoft yahei";}
.shop-item .part-03 .r h3{border: 1px solid #ccc; height: 32px; line-height: 32px;}
.shop-item .part-03 .r h3 input{width: 74px; padding: 0 4px; border: none; color: #ff5c00; font-family:PingFang  arial; font-size: 16px; font-weight: bold;}
.shop-item .part-03 .r h3 span{margin-right: 5px; float: right;}
.shop-item .part-03 .r p{text-align: center; color: #999;}
.shop-item .part-04 { width: 170px; margin-right:5px;}  
.shop-item .part-04 h3{text-align: center; line-height: 24px;}
.shop-item .part-04 h3 span{font-weight: bold; color: #ff5c00; font-size: 18px; font-family:PingFang  arial; margin-right: 3px;}
.shop-item .part-04 p{text-align: center; color: #aaa; line-height: 24px;}
.shop-item .part-05 { width: 100px; margin-right:5px;} 
.shop-item .part-06{width: 111px; text-align: center;}
.shop-item .part-06 a{display: block; width: 110px; height: 36px; line-height: 36px; font-size: 12px; }
.shop-item .part-07{width: 210px; margin-right: 5px; text-align: center;}
.shop-item .part-07 h3{border: 1px solid #ccc; width: 138px; height: 32px; line-height: 32px; display: inline-block;}
.shop-item .part-07 h3 input{width: 100px; padding: 0 4px; border: none; color: #ff5c00; font-family:PingFang  arial; font-size: 16px; font-weight: bold;}
.shop-item .part-07 h3 span{margin-right: 5px; float: right; font-family:  "PingFang,microsoft yahei";}
.shop-item .part-07 p{text-align: center; color: #999;}
.more-show{height: 40px; border-top: 1px solid #eee; background:#fbfbfb; border-radius: 0 0 5px 5px; text-align: center;}
.more-show p{font-family:  "PingFang,microsoft yahei"; line-height: 40px;}
.more-show p a{color: #aaa;}
.more-show p a em{margin-left: 5px;}
.shop-item .tags-box { margin-top: 4px;}
.shop-item .tags-box p { color: #888; margin-bottom: 4px;}
.shop-item .tags-box p em.tags { margin-right: 5px; margin-top: -4px;}

.noresult-div { width: 1190px; text-align: center; padding: 88px 0;}
.response-narrow .noresult-div { width: 1000px; }
.noresult-l { width: 180px; display: inline-block; *display: inline; *zoom:1; vertical-align: middle; margin-right: 22px;}
.noresult-r { display: inline-block; *display: inline; *zoom:1; vertical-align: middle; text-align: left;}
.noresult-r h3 { font-size: 20px; color: #ff6700; font-family:  "PingFang,microsoft yahei"; margin-bottom: 8px;}
.noresult-r h4 { font-size: 14px; margin-bottom: 2px;}
.noresult-r h5 { font-size: 14px; color: #aaa; margin-bottom: 20px;}
.noresult-r p .com-btn-02 { width: 100px; height: 32px; line-height: 32px;}
.noresult-r p .todunhao{font-size: 12px;  height: 30px; line-height: 30px; margin-left: 8px; border: #ff9a55 1px solid; border-radius: 2px; text-align: center; color: #ff6700; background: #fff7f2;}
.noresult-r p .todunhao:hover{color: #fff; background: #ff6700;}

.my-collect{ position: fixed; bottom: 280px; right:50%; margin-right: -670px;  width:50px; height: 50px; background: url(../../images/list-2024/my-collect-bg.png) no-repeat; background-size: 100%; }
.my-collect a{ display: block; width: 100%; text-align: center; font-size: 20px; color: #fff; font-family:"microsoft yahei"; padding:5px 0 15px 0;}
.layui-layer.title-pop .layui-layer-content{ border-radius: 10px; width: 450px; }
.layui-layer.title-pop .layui-layer-content i.layui-layer-TipsB{ transform: rotate(90deg); top: -15px; left: 20px; }

.layui-layer.hutong-pop .layui-layer-content{ border-radius: 10px; width: 350px; }
.layui-layer.hutong-pop .layui-layer-content i.layui-layer-TipsB{ transform: rotate(90deg); top: -15px; left: 20px; }

.tuijian{ position: fixed; width: 220px; top: 243px; left: 50%;  z-index: 9; margin-left: -820px;background: #FFFFFF; border-radius: 0px; border: 1px solid #FFBB95;}
.tuijian .tj-title{ height: 44px; background: #FFF3EC; display: flex; align-items: center; justify-content: space-between; padding: 0 12px;  }
.tuijian .tj-title img{ height: 17px; }
.tuijian .tj-title a{ color: #666666; font-size: 12px; }
.tuijian .taba{height: 32px; border-bottom: 1px solid #eeeeee; padding: 0 10px; display: flex; justify-content: space-around; }
.tuijian .taba a{width: 60px; text-align: center; line-height: 32px; height: 32px; font-size: 13px; font-family:  "PingFang,microsoft yahei"; position: relative; }
.tuijian .taba a.on,.tuijian .taba a:hover{color: #ff5c00; font-weight: bold;}
.tuijian .taba a.on::after{ content: ''; width: 60px; height: 3px; position: absolute; background: #ff5c00; bottom: -1px; left: 0; }
.tuijian .tjcon{padding: 0 5px;}
.tuijian .tjcon .detcon{border-bottom: 1px dashed #e5e5e5; padding: 10px 5px 15px 5px;}
.tuijian .tjcon .detcon p{line-height: 22px;}
.tuijian .tjcon .detcon p.qfparm img{vertical-align: middle; padding-left: 5px; height: 16px; }
.tuijian .tjcon .detcon h3{font-weight: bold; line-height: 24px; color: #333;}
.tuijian .tjcon .detcon h3 img{vertical-align: middle; padding-right: 5px;}
.tuijian .tjcon .detcon p.ifparm{overflow: hidden;}
.tuijian .tjcon .detcon p.ifparm em{display: block; float: left; width: 60px; height: 24px; color:#999999;}
.tuijian .tjcon .detcon p.ifparm span{display: block; float: left; width: 140px;}
.tuijian .tjcon .detcon p.ifparm span i{color: #ff6700; padding: 0 3px; font-weight: bold; font-size: 14px; font-family:PingFang  arial;}
.tuijian .tjcon .detcon p.ifparm span input{ width: 50px; padding: 0 4px; height: 22px; border-radius: 2px; margin-right: 5px; border: 1px solid #dddddd; background: #fafafa;}
.tuijian .tjcon .detcon a{width: 100%; margin-top: 3px; display: inline-block; text-align: center; color:#FF5C00; height: 30px; background: #FFFFFF; border-radius:3px; border: 1px solid #FF5C00;height:28px; line-height: 28px; }
.tuijian .tjcon .detcon a:hover{ background: #ff6700; color: #ffffff; }
.tuijian .lkmore{text-align: center; padding: 10px 0; }
.tuijian .lkmore a{color: #aaa; line-height: 30px; margin-top: 6px; padding: 0 15px;}
.tuijian .lkmore a.ruzhu{color: #ff6700;}
.tuijian .lkmore em{color: #aaa;}
.tuijian .lkmore a.wantsell{width: 130px; margin-top: 0px; display: inline-block; height: 30px; line-height: 30px; background: #ff6700; color: #ffffff; }
.tuijian ul li{padding: 7px 5px 8px 5px; border-bottom: 1px dashed #e5e5e5;}
.tuijian ul li p{line-height: 24px; height: 24px; overflow: hidden;}
.tuijian ul li p img{vertical-align: middle; height: 16px; margin: -2px 0 0 2px; }
.tuijian ul li p i{color: #ff6700;}
.tuijian ul li p em{color: #ff6700; padding: 0 3px; font-family:PingFang  arial; font-size: 14px; font-weight: bold;}
.tuijian ul li p a{color: #fff; background: #ff6700; margin-left: 5px; border-radius:3px; padding:2px 5px;}
.tuijian ul li p.sgnum{color: #aaa;}

.right-float{ position: fixed; width: 150px; height: 350px; top: 230px; z-index: 9; margin-right: -750px; right: 50%;}
.noadv{ position: fixed; width: 180px; height: 203px; bottom: 130px; left: 50%;  z-index: 9; margin-left: -780px;  background:url(../../images/list/nogzfl.jpg) no-repeat; border: 1px solid #FFBB95; }
.noadv a{display: block; width: 163px; margin: 161px auto 0 auto; font-weight: bold;}

.layui-layer.pop-tip{ border-radius: 10px; }
.group-layer{padding:20px; font-family:  "PingFang,microsoft yahei"; border-radius: 10px;}
.group-layer span.closeBtn{position: absolute; top: 15px; right: 15px; font-size: 16px; color: #333; cursor: pointer;}
.group-layer h3{font-size: 18px; color: #333; padding-bottom:20px; text-align: center; font-weight: bold; }
.group-layer p{ padding-bottom: 15px; }
.group-layer p span{color: #FF5C00;}
.group-layer p em{color: #3399FF;}
.group-layer h4{ padding-bottom: 10px; text-align: center; }
.group-layer h4 a{display: inline-block; width: 120px; margin: 0 8px; height: 32px; line-height: 32px; font-size: 12px; border-radius: 4px; }
.group-layer h4 a.surepub{background: #ff6700; color: #fff;}
.group-layer h4 a.clepub{background: #ffffff; border: 1px solid #DDDDDD; box-sizing: border-box; color: #666666; line-height:30px;}
.group-layer h5{ text-align: center; color: #999999; }
.group-layer h5 input{ vertical-align: middle; margin-right: 5px; margin-top: -3px; }
.toupdata{padding:10px 55px;}
.toupdata span.closeBtn{position: absolute; top: 15px; right: 15px; font-size: 16px; color: #333; cursor: pointer;}
.toupdata h3{font-size: 22px; font-family:  "PingFang,microsoft yahei"; color: #333; padding-bottom:20px; text-align: center;}
.toupdata p{color: #333; line-height: 24px; font-size: 14px; font-family:  "PingFang,microsoft yahei";}
.toupdata p span{color: #ff6700;}
.toupdata h4{text-align: center; padding: 25px 0 20px 0;}
.toupdata p.btnp{text-align: center; margin-top: 30px;}
.toupdata p.btnp a{width: 140px; border-radius: 4px; }
.toreal{padding:30px;}
.toreal span.closeBtn{position: absolute; top: 15px; right: 15px; font-size: 16px; color: #333; cursor: pointer;}
.toreal h3{font-size: 22px; font-family:  "PingFang,microsoft yahei"; color: #333; padding-bottom:20px; text-align: center;}
.toreal p{color: #999; line-height: 24px;}
.toreal h4{text-align: center; padding: 25px 0 35px 0;}
.toreal p.btnp{text-align: center;}
.toreal p.btnp a{width: 140px;  border-radius: 4px;}

.layui-layer.pop-chose{ border-radius: 30px; }
.chose-box{ border-radius: 30px; position: relative; text-align: center; padding-bottom: 30px; }
.chose-box .chose-bg{ width: 698px; position: absolute; top: 1px; left: 1px; height: 240px; background: linear-gradient( 180deg, #FFF1EC 0%, #FFFFFF 100%); border-radius: 30px 30px 0 0; z-index:1; }
.chose-box .chose-con{ position: relative; z-index: 2; }
.chose-box h3.title{font-weight: 600; font-size: 26px; color: #222222; padding-top: 25px; }
.chose-box p.tips{font-weight: 400; font-size: 16px; color: #999999;  padding-top: 5px;}
.chose-box .chose-img{ margin-top: 22px; display: flex; justify-content: space-between; align-items: center; padding: 0 40px; }
.chose-box .chose-img img{ width: 297px; }
.chose-box .chose-btn{ margin-top: 20px; display: flex; align-items: center; justify-content: space-between; padding: 0 40px;  }
.chose-box .chose-btn a{width: 295px; height: 42px; font-weight: 400; font-size: 16px; line-height: 42px; color: #222222; background: #FFFFFF; border-radius:15px; border: 1px solid #CCCCCC}

@keyframes shake {
  0%, 100% { transform: translateY(0); }
  25% { transform: translateY(-3px); }
  50% { transform: translateY(3px); }
  75% { transform: translateY(-3px); }
}
.sk-fading-circle {
  margin: 0 auto;
  width: 40px;
  height: 40px;
  position: relative;
}

.sk-fading-circle .sk-circle {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.sk-fading-circle .sk-circle:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #ff5c00;
  border-radius: 100%;
  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
          animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}
.sk-fading-circle .sk-circle2 {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg); 
}
.sk-fading-circle .sk-circle12 {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg); 
}
.sk-fading-circle .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; 
}
.sk-fading-circle .sk-circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; 
}
.sk-fading-circle .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; 
}
.sk-fading-circle .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; 
}
.sk-fading-circle .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; 
}
.sk-fading-circle .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; 
}
.sk-fading-circle .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; 
}
.sk-fading-circle .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; } 
}