section.content{padding:clamp(50px,.3676rem + 4.902vw,100px) 0 clamp(120px,5.8456rem + 2.9412vw,150px);background:#f3f5f8}section.content .container{grid-column:var(--s-grid)}section.content .title-block{max-width:1050px;width:100%}section.content .title-block .des{margin-top:30px}section.content .content-block{margin-top:50px;display:flex;flex-wrap:wrap;gap:80px 27px}@media only screen and (max-width: 1200px){section.content .content-block{gap:50px 27px}}section.content .accessory-item{width:calc((100% - 81px)/4);border-radius:5px;transition:box-shadow var(--trans-normal)}section.content .accessory-item .inner{display:flex;flex-direction:column;height:100%;border:1px solid rgba(255,255,255,0);border-radius:5px;overflow:hidden;transition:border var(--trans-normal)}section.content .accessory-item .inner .pic{position:relative}section.content .accessory-item .inner .pic:before{display:block;width:100%;height:0;padding-bottom:108.1081081081%;content:""}section.content .accessory-item .inner .pic picture{position:absolute;left:0;top:0;display:block;width:100%;height:100%}section.content .accessory-item .inner .pic img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover}section.content .accessory-item .inner .pic img{transition:transform var(--trans-normal)}section.content .accessory-item .inner .bottom{padding:30px;display:flex;flex-direction:column;width:100%;height:100%;background:#363636;transition:background var(--trans-normal);z-index:1}section.content .accessory-item .inner .title{color:#fff}section.content .accessory-item .inner .indexItemTitle-m{display:block;overflow:hidden;display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}section.content .accessory-item .inner .text{margin-top:10px;padding-bottom:30px;color:#fff}section.content .accessory-item .inner .paragraphText{display:block;overflow:hidden;display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}section.content .accessory-item .inner .btn-group{margin-top:auto;display:flex;align-items:center}section.content .accessory-item .inner .circle-arrow-btn{margin-right:auto}section.content .accessory-item .inner .compare-btn{padding:7px 20px;position:relative;display:flex;align-items:center;min-width:155px;color:#fff;border-radius:100px;cursor:pointer;transition:color var(--trans-xs)}section.content .accessory-item .inner .compare-btn.active{background:#fff3}section.content .accessory-item .inner .compare-btn.active .icon-plus{opacity:0}section.content .accessory-item .inner .compare-btn.active .icon-correct{opacity:1}section.content .accessory-item .inner .compare-btn:before{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:100px;border:1px solid rgba(255,255,255,.2);z-index:-1;transition:border var(--trans-xs),background var(--trans-xs);content:""}@media only screen and (min-width: 1201px){section.content .accessory-item .inner .compare-btn:hover{color:#165867}section.content .accessory-item .inner .compare-btn:hover:before{border:1px solid #FFFFFF;background:#fff}}@media only screen and (max-width: 1200px){section.content .accessory-item .inner .compare-btn:active{color:#165867}section.content .accessory-item .inner .compare-btn:active:before{border:1px solid #FFFFFF;background:#fff}}section.content .accessory-item .inner .compare-btn .btnText{margin-right:20px}section.content .accessory-item .inner .compare-btn .icon{display:flex;justify-content:center;align-items:center;width:12px;height:12px}section.content .accessory-item .inner .compare-btn .icon i{position:absolute;font-size:.75rem}section.content .accessory-item .inner .compare-btn .icon-plus{opacity:1;transition:opacity var(--trans-xs)}section.content .accessory-item .inner .compare-btn .icon-correct{opacity:0;transition:opacity var(--trans-xs)}@media only screen and (min-width: 1201px){section.content .accessory-item:hover{box-shadow:15px 15px 20px #0000001a}section.content .accessory-item:hover .inner{border:1px solid white}section.content .accessory-item:hover .inner .pic img{transform:scale(1.1)}section.content .accessory-item:hover .bottom{background:#41aeb2}}@media only screen and (max-width: 1200px){section.content .accessory-item:active{box-shadow:15px 15px 20px #0000001a}section.content .accessory-item:active .inner{border:1px solid white}section.content .accessory-item:active .inner .pic img{transform:scale(1.1)}section.content .accessory-item:active .bottom{background:#41aeb2}}@media only screen and (max-width: 1280px){section.content .accessory-item{width:calc((100% - 54px) / 3)}}@media only screen and (max-width: 1200px){section.content .accessory-item .inner .bottom{padding:20px}}@media only screen and (max-width: 900px){section.content .accessory-item{width:calc((100% - 27px)/2)}}@media only screen and (max-width: 767px){section.content .accessory-item .inner .compare-btn{padding:5px 12px;min-width:139px}}@media only screen and (max-width: 575px){section.content .accessory-item{width:100%}}