.top-nav{background-color:#f5f5f5;flex-wrap:wrap;place-content:center space-between;align-items:center;gap:15px;width:100%;height:auto;min-height:80px;padding:20px 80px;display:flex}@media (max-width:1500px){.top-nav{padding:20px 40px}}@media (max-width:800px){.top-nav{justify-content:center;padding:15px 20px}}.top-nav .logo{color:#1c1c1c;font-size:2rem;font-weight:500;text-decoration:none}@media (max-width:800px){.top-nav .logo{text-align:center;width:100%;font-size:1.8rem}}.top-nav .top-nav-list{gap:40px;display:flex}@media (max-width:1500px){.top-nav .top-nav-list{gap:20px}}@media (max-width:800px){.top-nav .top-nav-list{display:none}}.top-nav .top-nav-list .header-link{color:#1c1c1c;white-space:nowrap;font-size:1.1rem}@media (max-width:1500px){.top-nav .top-nav-list .header-link{font-size:1rem}}.side-action{justify-content:flex-end;align-items:center;gap:16px;display:flex}@media (max-width:800px){.side-action{justify-content:center;gap:20px;width:100%}}.side-action .header-icon{color:#1c1c1c;width:24px;height:24px}.side-action .cart-icon{width:36px;height:30px;position:relative}.side-action .cart-icon .cart-length{color:#1c1c1c;font-size:12px;position:absolute;top:0;right:2px}.side-action .search-wrapper{width:200px;max-width:100%;position:relative}.side-action .search-wrapper .top-input{border:1px solid #ccc;border-radius:8px;outline:none;width:100%;padding:8px 12px 8px 35px;font-size:1rem;transition:border .3s,box-shadow .3s}.side-action .search-wrapper .top-input:focus{border-color:#1c1c1c;box-shadow:0 0 5px #1c1c1c33}@media (800px<=width<=1500px){.side-action .search-wrapper .top-input{font-size:.9rem}}@media (320px<=width<=800px){.side-action .search-wrapper .top-input{font-size:.8rem}}.side-action .search-wrapper .header-icon{color:#1c1c1c;pointer-events:none;width:20px;height:20px;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.side-action .search-wrapper .search-results{z-index:1000;opacity:0;background:#fff;border:1px solid #ccc;border-radius:8px;max-height:250px;margin-top:5px;padding:5px 0;transition:opacity .2s,transform .2s;position:absolute;top:100%;left:0;right:0;overflow-y:auto;transform:translateY(-5px);box-shadow:0 4px 8px #0000001a}.side-action .search-wrapper .search-results.visible{opacity:1;transform:translateY(0)}.side-action .search-wrapper .search-results .search-item{text-align:center;cursor:pointer;place-items:center;gap:10px;padding:6px 10px;list-style:none;transition:background .2s;display:flex}.side-action .search-wrapper .search-results .search-item:hover{background-color:#f5f5f5}.side-action .search-wrapper .search-results .search-item .link-result{align-items:center;gap:4px;display:flex}.side-action .search-wrapper .search-results .search-item .link-result img{object-fit:cover;border-radius:4px;width:40px;height:40px}.side-action .search-wrapper .search-results .search-item .link-result span{color:#333;font-size:.8rem}@media (800px<=width<=1500px){.side-action .search-wrapper .search-results{max-height:200px}.side-action .search-wrapper .search-results .search-item span{font-size:.8rem}.side-action .search-wrapper .search-results .search-item img{width:35px;height:35px}}@media (320px<=width<=800px){.side-action .search-wrapper .search-results{max-height:150px}.side-action .search-wrapper .search-results .search-item span{font-size:.75rem}.side-action .search-wrapper .search-results .search-item img{width:30px;height:30px}}.page-header{text-align:center;width:100%;height:223px;margin-top:30px}@media (320px<=width<=800px){.page-header{margin-top:20px}}.page-header .basic-text-head{color:#1c1c1c;font-size:36px;font-weight:400;line-height:140%}@media (800px<=width<=1500px){.page-header .basic-text-head{font-size:26px}}@media (320px<=width<=800px){.page-header .basic-text-head{font-size:16px}}
