.mobile-dlp-tabs_list { display: flex; padding: 16px 0 18px; overflow: auto; white-space: nowrap; } .mobile-dlp-tabs_list::-webkit-scrollbar { display: none; } .mobile-dlp-tabs_item { margin-left: 16px; padding: 4px 0; font-size: 16px; line-height: 16px; cursor: pointer; color: #000; font-family: "Noto Sans"; } .mobile-dlp-tabs_item_active { border-bottom: 2px #a4a2a2 solid; } .mobile-dlp-tabs_item:last-child { margin-right: 16px; } .mobile-dlp-tabs_item_hide { display: none; } .dlp-tabs { width: 100%; background: #fff; z-index: 999; top: 0; } .dlp-tabs .dlp_nav { position: relative; border-bottom: 1px solid #e3e3e3; } .dlp-tabs .dlp_nav_list { box-sizing: border-box; overflow: hidden; padding-top: 14px; white-space: nowrap; font-size: 0; text-align: center; transition: all 1s; min-height: 124px; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item { cursor: pointer; text-align: left; font-size: 30px; display: inline-block; vertical-align: top; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap { padding-bottom: 10px; width: 124px; margin: 0 15px; position: relative; display: flex; flex-direction: column; border-bottom: 8px solid transparent; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_image { height: 50px; text-align: center; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_image img { max-height: 100%; max-width: 100%; display: inline-block; font-size: 12px; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_image .normal_icon { display: inline-block; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_image .hover_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_text { margin-top: 8px; color: #757575; font-size: 14px; line-height: 17px; text-align: center; overflow: hidden; white-space: normal; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .column_line { position: absolute; height: calc(100% - 10px); width: 1px; background-color: #e3e3e3; right: -15px; top: 0; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item:last-child { margin-right: 0; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active { border-bottom: 8px solid var(--med-blue)  !important; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active .nav_item_text { color: var(--med-blue); } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active .nav_item_image .normal_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active .nav_item_image .hover_icon { display: inline-block; } .gaming-theme-black .dlp-tabs { background-color: #000; } .gaming-theme-black .dlp-tabs .dlp_nav_item .dlp_nav_item_cont { background: transparent  !important; } .gaming-theme-black .dlp-tabs .dlp_nav { border-bottom: 1px solid #55626d; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item:hover .nav_item_text { color: #0ff  !important; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap .nav_item_text { color: #fff; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap:hover { border-bottom: 8px solid #0ff; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap .nav_item_text:hover { color: #0ff; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap .nav_item_image { color: #fff; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap_active { border-bottom: 8px solid #0ff; } .gaming-theme-black .dlp-tabs .dlp_nav .new_dlp_tabs_nav_item .wrap_active .nav_item_text { color: #0ff; } .gaming-theme-black .dlp-tabs .dlp_nav .dlp_arrow { border-top: 2px solid #0ff; border-left: 2px solid #0ff; }.dlp-tabs { padding: 0 20px; overflow: hidden; border-bottom: 1px solid #e3e3e3; } .dlp-tabs .dlp_nav { overflow: hidden; width: 100%; border: none; } .dlp-tabs .dlp_nav .dlp_nav_list { overflow: initial; } .dlp-tabs .dlp_nav_item { position: absolute; top: 0; width: 60px; height: 100%; } .dlp-tabs .dlp_nav_item .dlp_nav_item_cont { display: flex; align-items: center; justify-content: flex-end; height: 100%; background: transparent; padding-right: 5px; padding-left: 5px; background: -webkit-linear-gradient(left, transparent, #fff); background: -o-linear-gradient(right, transparent, #fff); background: -moz-linear-gradient(right, transparent, #fff); background: linear-gradient(to right, transparent, #fff); } .dlp-tabs .dlp_arrow { width: 16px; height: 16px; border-top: 2px solid #000; border-left: 2px solid #000; transform: rotate(135deg); cursor: pointer; } .dlp-tabs .dlp_nav_next { right: 0px; } .dlp-tabs .dlp_nav_prev { left: 0px; z-index: 99; } .dlp-tabs .dlp_nav_prev .dlp_nav_item_cont { justify-content: flex-start; background: -webkit-linear-gradient(left, #fff, transparent); background: -o-linear-gradient(right, #fff, transparent); background: -moz-linear-gradient(right, #fff, transparent); background: linear-gradient(to right, #fff, transparent); } .dlp-tabs .dlp_nav_prev .dlp_arrow { transform: rotate(-45deg); } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item { height: inherit; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap { min-height: 110px; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap .nav_item_text:hover { color: #294e95; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover { border-bottom: 8px solid #294e95; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover .nav_item_image .normal_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover .nav_item_image .hover_icon { display: inline-block; transform: scale(1.2); } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover .nav_item_image_no_hover .normal_icon { display: inline-block; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover .nav_item_image_no_hover .hover_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap:hover .nav_item_text { color: #294e95; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover { border-bottom: 8px solid var(--med-blue); } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover .nav_item_image .normal_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover .nav_item_image .hover_icon { transform: scale(1.2); display: inline-block; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover .nav_item_image_no_hover .normal_icon { display: inline-block; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover .nav_item_image_no_hover .hover_icon { display: none; } .dlp-tabs .dlp_nav_list .new_dlp_tabs_nav_item .wrap_active:hover .nav_item_text { color: var(--med-blue); }