.home-recommended .box .swiper-slide .img{overflow: hidden;}
.home-blogs{padding:0 0 5%}
.home-blogs .home-title{text-align:center}
.blogs-item{margin-top:45px}
.blogsitem{display:flex;justify-content:space-between;padding:15px;align-items:center}
.blogsitem .logo img{width:45px;height:45px;display:block}
.blogsitem .link{width:30px;height:30px;display:flex;justify-content:center;align-items:center;background:#000;border-radius:6px;cursor:pointer;transition:all .3s ease}
.bloginfo{padding:15px;border-top:1px solid #d8dcde;display:none}
.bloginfo .blogimgs{margin-bottom:10px}
.bloginfo .blogimgs img{width:100%;height:auto;border-radius:5px}
.bloginfo .blogtext p{font-size:14px;line-height:1.5;color:#333;margin:0}
.blogsitem .link em{color:#fff;line-height:1;font-size:24px;width:24px}
.blogsitem .time a{font-size:20px;font-weight:500}
.blogsboxs{background-color:#fff;color:#00222d;box-shadow:none;border:1px solid #d8dcde;border-radius:5px}
.blogsimg{position:relative;cursor: pointer;}
.blogsimg img{width:100%;aspect-ratio:1.5/1;object-fit:cover}
.blogsimg .blogtit p::before{position:absolute;content:'”';left:50%;top:-30%;transform:translateX(-50%);font-size:50px;line-height:1}
.blogsimg .blogtit p::after{position:absolute;content:'“';bottom:-100%;left:45%;transform:translateY(-50%);font-size:50px;line-height:1}
.blogsimg .blogtit p{font-size:18px;font-weight:500;line-height:1.52;position:relative}
.blogsimg .blogtit{position:absolute;width:100%;height:100%;top:0;left:0;background:#fff;padding:20px;display:flex;justify-content:center;align-items:center;text-align:center;opacity:0;z-index:0;transition:all .3s ease-in-out}
.blogsboxs:hover .blogtit{opacity:1;z-index:3}
.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:none;justify-content:center;align-items:center;z-index:99999}
.popup-content{background:#00000040;width:100%;height:100%;display:flex;justify-content:center;align-items:center}
.popup-con{position:relative;box-shadow:0 5px 15px rgba(0,0,0,.3);display:flex;overflow:hidden;border-radius:10px;background:#fff;flex-direction:row;height:80%;width:80%}
.popup-left{flex:1;min-width:300px;align-items:center;background-color:#000;background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:4px 0 0 4px;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative}
.popup-left img{height:100%;object-fit:cover;width: 100%;}
.popup-right{display:flex;flex-direction:column;justify-content:center;flex-shrink:0;padding:20px 20px 15px;position:relative;width:30%}
.popup-close{position:absolute;top:30px;right:40px;font-size:3vw;line-height:1;cursor:pointer;color:#fff;z-index:10}
.popup-content p{font-size:16px;line-height:1.5;color:#333;margin:0 0 20px 0;height:80%;overflow:auto;padding-right:3%}
.popup-content .blogshar{margin-top:20px;padding-top:20px;border-top:1px solid #eee}
.popup-content .blogshar ul{list-style:none;padding:0;margin:0;display:flex;gap:10px}
.popup-content .blogshar li{margin:0}
.popup-content .blogshar a{display:flex;justify-content:center;align-items:center;width:40px;height:40px;border-radius:50%;background:#f0f0f0;color:#333;text-decoration:none;transition:all .3s ease}
.popup-content .blogshar a:hover{background:#e0e0e0;transform:translateY(-2px)}
.blogbutton-next,.blogbutton-prev{position: absolute;height: 60px;z-index: 9;top: 50%;margin-top: -35px;width: 60px;background-color: rgba(255, 255, 255, 0.7);border: none;display: flex;align-items: center;justify-content: center;cursor: pointer;}
.blogbutton-next em,.blogbutton-prev em{border-radius: 100%;width: 28px;height: 28px;display: flex;align-items: center;justify-content: center;border: none;background-color: white;cursor: pointer;fill: #00222d;box-shadow: 0 0 7px 0px #00000097;transition: all 0.25s ease;}
.blogbutton-next{border-radius: 0 50px 50px 0;}
.blogbutton-prev{right: 0;border-radius: 50px 0 0 50px;}
@media (max-width:768px){.popup-content{flex-direction:column}
.popup-left{min-height:200px}}