body,html {margin:0;padding:0;font-family:Arial,sans-serif;background-color:#f4f4f4;}
.nr {padding:30px;}
.buttons {margin-bottom:20px;}
.buttons button {margin:0 5px;color:#999;cursor:pointer;display:inline-block;letter-spacing:1px;line-height:32px;outline:none;padding:0 13px;text-align:center;border-radius:5px;font-weight:400;background:#fff;border:1px solid #eee;font-size:15px;margin:5px auto;}
.buttons button:hover {background-color:#ff5000;background-image:linear-gradient(135deg,#f59f54 10%,#ff6922 100%);box-shadow:0 5px 10px 0 rgba(255,87,0,0);color:#fff !important;}
.container {overflow:hidden;width:100%;border-radius:8px;text-align:center;}
.search-bar {margin:auto;max-width:580px;display:flex;justify-content:center;align-items:center;margin-bottom:20px;}
.search-bar input[type="text"] {width:calc(100% - 150px);padding:10px;font-size:16px;border:1px solid #ccc;border-radius:4px 0 0 4px;}
.search-bar button {padding:10px 20px;font-size:16px;border:none;background-color:#007BFF;color:#fff;border-radius:0 4px 4px 0; cursor:pointer;}
.search-bar button:hover {background-color:#0056b3;}
.result-item {align-items:center;position:relative;justify-content:space-between;margin-bottom:15px;margin-left:auto;border:1px solid #fff;border-radius:4px;background-color:#fafafa;display:inline-block;overflow:hidden;box-shadow:0px 4px 10px rgba(20,20,20,0.1);height:580px;width:calc(20% - 30px);margin-right:30px;}
.result-item h3 {padding:10px;background-color:#c1bcbc;margin:10px;font-size:18px;}
.result-item a {text-decoration:none;color:#505050;font-size:14px;display:block;}
.result-item  span {line-height:3;display:block;font-size:16px;width:100%;background-color:#fff;position:sticky;bottom:0;}
.result-item>a>span>i {border-radius:50%;height:6px;margin-right:5px;display:block;width:6px;background-color:#fd721f;font-size:11px;letter-spacing:.2px;}
.result-item a:hover {text-decoration:none;}
.result-item:hover {transform:translateY(-3px) scale(1.04);box-shadow:0 4px 8px rgba(0,0,0,0.2);}
.result-item a img {width:100%;height:500px;object-fit:cover;/* 保持图片比例 */      /* border-radius:4px;*/      /*margin-right:15px;*/}
.mask {position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);display:none;justify-content:center;align-items:center;flex-direction:column;}
.mask img {width:180px;height:180px;background:#fff;padding:10px;border-radius:8px;}
.mask p {color:white;margin-top:10px;font-size:14px;}
.mask a {display:block;text-align:center;border-radius:4px;font-size:16px;padding:10px 30px;letter-spacing:1px;color:#fff;}
.mask a:first-of-type {background-image:linear-gradient(135deg,#1f81ff 10%,#389aff 100%);margin-bottom:30px;}
.mask a:last-child {background-image:linear-gradient(135deg,#ff7049 10%,#fd420a 100%);}
.title {line-height:30px;background-color:#d9d9d9;width:100%;}
.footer {height:50px;text-align:center;margin-top:20px;}
#pop_up_mask {position:fixed;width:100%;height:100%;top:0;left:0;background-color:rgba(0,0,0,.8);z-index:999;display: none;}
.pop_up_main {width:430px;height:0;position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;}
.pop_up_main iframe {width:100%;height:100%;border-radius:5px;}
.pop_up_main .close_icon {position:absolute;right:-44px;top:-44px;width:34px;height:34px;cursor:pointer;display:none;}
.pop_up_main .close_icon img {width:100%;height:100%;}
.pop_up_wx_title {font-size:20px;color:#586578;height:75px;line-height:75px;padding-top:6px;font-size:18px;}
.pop_up_wx .pop_up_wx_title {margin-top:40px;margin-bottom:10px;}
.wx_0s .ts {color:#9299a6;font-size:14px;height:16px;}
.wx_0s .ts img {width:18px;height:15px;position:relative;top:2px;margin-right:5px;}
.wx_0s .ts span {color:#11233f;}
.pop_up_wx {background:#fff;border:1px solid #e8e8e8 !important;position:absolute;min-height:500px;padding-bottom:60px;width:430px;color:#333;right:0;border-radius:6px;text-align:center;box-sizing:border-box;}

@media screen and (min-width:1440px) {.result-item {width:calc(20% - 30px);height:560px;}
    .result-item:nth-child(5n+5) {margin-right:0;}
}
@media screen and (min-width:1200px) and (max-width:1440px) {.result-item {width:calc(20% - 30px);height:520px;}
    .result-item:nth-child(5n+5) {margin-right:0;}
}
@media screen and (min-width:960px) and (max-width:1199px) {.result-item {width:calc(25% - 30px);height:480px;}
    .result-item:nth-child(4n+4) {margin-right:0;}
}
@media screen and (min-width:768px) and (max-width:959px) {.result-item {width:calc(33.33% - 30px);height:420px;}
    .result-item:nth-child(3n+3) {margin-right:0;}
}
@media only screen and (min-width:480px) and (max-width:767px) {.result-item {width:calc(50% - 30px);height:320px;}
    .result-item:nth-child(2n+2) {margin-right:0;}.mask img{ width: 150px!important; height: 150px!important;}.mask p{ margin: 5px auto}.mask a:first-of-type{ margin-bottom: 10px!important;}
}
@media only screen and (max-width:479px) {.result-item {width:100%;}
}