style> /*---------CSS STYLE----------*/ #box_banner_pwa{ display: none; } #box_banner_category{ width: 100%; display: flex; margin: 0 auto; justify-content: center; } #box_banner_category img{ width: 80%; /*max-height: 100%;*/ transition: all 0.4s ; justify-self: center; } #box_banner_category .slider{ display: flex; width: 12.5%; justify-content: center; } #box_banner_category .slider .t-img_slider{ width: 90%; font-size: 0.8vw; overflow: hidden; padding-bottom: 1em; } #box_banner_category .slider .t-img_slider:hover p{ text-decoration: underline; } #box_banner_category .slider .t-img_slider:hover img{ opacity: 0.8; transform: scale(1.04); } @media screen and (max-width: 1440px) { #box_banner_category .slider .t-img_slider { font-size: 1.1vw; } } @media screen and (max-width: 1280px) { #box_banner_category .slider .t-img_slider { font-size: 1.1vw; } } @media screen and (max-width: 768px) { .banner_pwa{ grid-column: 1/-1; grid-row: 1/-1; width: 100%; overflow: scroll; position: relative; } #box_banner_category{ width: fit-content; justify-content: flex-start; margin: 0; } #box_banner_category .slider{ display: flex; width: 20vw; } #box_banner_category .slider .t-img_slider { font-size:2.3vw; width: 100%; } .mostly-customized-scrollbar::-webkit-scrollbar { width: 5px; height: 8px; background-color: #aaa; /* or add it to the track */ } } @media screen and (max-width: 760px) { .banner_pwa{ width: 100%; overflow: scroll; } #box_banner_category{ width: fit-content; margin: 2% 0; } #box_banner_category .slider{ display: flex; width: 30vw; } #box_banner_category .slider .special_op { font-size: 2.5vw; } #box_banner_category .slider .t-img_slider { font-size: 3.5vw; } .mostly-customized-scrollbar::-webkit-scrollbar { width: 5px; height: 8px; background-color: #aaa; /* or add it to the track */ } .categoriesChildFilter{ display: none; } }