@media (min-width: 1025px){ .cy-fs-1{ font-size: 4.0rem !important; } .cy-fs-2{ font-size: 3.0rem !important; } .cy-fs-3{ font-size: 2.0rem !important; } .cy-fs-4{ font-size: 1.5rem !important; } .cy-fs-5{ font-size: 1.2rem !important; } .cy-fs-6{ font-size: 1.0rem !important; } .cy-fs-7{ font-size: 0.9rem !important; } .cy-fs-8{ font-size: 0.8rem !important; } .cy-fs-9{ font-size: 0.6rem !important; } .cy-fs-md-1{ font-size: 4.0rem !important; } .cy-fs-md-2{ font-size: 3.0rem !important; } .cy-fs-md-3{ font-size: 2.0rem !important; } .cy-fs-md-4{ font-size: 1.5rem !important; } .cy-fs-md-5{ font-size: 1.2rem !important; } .cy-fs-md-6{ font-size: 1.0rem !important; } .cy-fs-md-7{ font-size: 0.9rem !important; } .cy-fs-md-8{ font-size: 0.8rem !important; } .cy-fs-md-9{ font-size: 0.6rem !important; } } @media (max-width: 1024px){ .cy-fs-md-1{ font-size: 4.0rem !important; } .cy-fs-md-2{ font-size: 3.0rem !important; } .cy-fs-md-3{ font-size: 2.0rem !important; } .cy-fs-md-4{ font-size: 1.5rem !important; } .cy-fs-md-5{ font-size: 1.2rem !important; } .cy-fs-md-6{ font-size: 1.0rem !important; } .cy-fs-md-7{ font-size: 0.9rem !important; } .cy-fs-md-8{ font-size: 0.8rem !important; } .cy-fs-md-9{ font-size: 0.6rem !important; } .cy-fs-1{ font-size: 4.0rem !important; } .cy-fs-2{ font-size: 3.0rem !important; } .cy-fs-3{ font-size: 2.0rem !important; } .cy-fs-4{ font-size: 1.5rem !important; } .cy-fs-5{ font-size: 1.2rem !important; } .cy-fs-6{ font-size: 1.0rem !important; } .cy-fs-7{ font-size: 0.9rem !important; } .cy-fs-8{ font-size: 0.8rem !important; } .cy-fs-9{ font-size: 0.6rem !important; } } @media (min-width: 1025px){ .p-md-6{ padding: 5rem; } .ps-md-6{ padding-left: 5rem; } .pt-md-6{ padding-top: 5rem; } .pe-md-6{ padding-right: 5rem; } .pb-md-6{ padding-bottom: 5rem; } .p-md-7{ padding: 8rem; } .ps-md-7{ padding-left: 8rem; } .pt-md-7{ padding-top: 8rem; } .pe-md-7{ padding-right: 8rem; } .pb-md-7{ padding-bottom: 8rem; } .p-md-8{ padding: 10rem; } .ps-md-8{ padding-left: 10rem; } .pt-md-8{ padding-top: 10rem; } .pe-md-8{ padding-right: 10rem; } .pb-md-8{ padding-bottom: 10rem; } .p-md-9{ padding: 15rem; } .ps-md-9{ padding-left: 15rem; } .pt-md-9{ padding-top: 15rem; } .pe-md-9{ padding-right: 15rem; } .pb-md-9{ padding-bottom: 15rem; } } @media (max-width: 1024px){ .p-6{ padding: 5rem; } .ps-6{ padding-left: 5rem; } .pt-6{ padding-top: 5rem; } .pe-6{ padding-right: 5rem; } .pb-6{ padding-bottom: 5rem; } .p-7{ padding: 8rem; } .ps-7{ padding-left: 8rem; } .pt-7{ padding-top: 8rem; } .pe-7{ padding-right: 8rem; } .pb-7{ padding-bottom: 8rem; } .p-8{ padding: 10rem; } .ps-8{ padding-left: 10rem; } .pt-8{ padding-top: 10rem; } .pe-8{ padding-right: 10rem; } .pb-8{ padding-bottom: 10rem; } .p-9{ padding: 15rem; } .ps-9{ padding-left: 15rem; } .pt-9{ padding-top: 15rem; } .pe-9{ padding-right: 15rem; } .pb-9{ padding-bottom: 15rem; } } @media (min-width: 1025px){ .m-md-6{ margin: 5rem; } .ms-md-6{ margin-left: 5rem; } .mt-md-6{ margin-top: 5rem; } .me-md-6{ margin-right: 5rem; } .mb-md-6{ margin-bottom: 5rem; } .m-md-7{ margin: 8rem; } .ms-md-7{ margin-left: 8rem; } .mt-md-7{ margin-top: 8rem; } .me-md-7{ margin-right: 8rem; } .mb-md-7{ margin-bottom: 8rem; } .m-md-8{ margin: 10rem; } .ms-md-8{ margin-left: 10rem; } .mt-md-8{ margin-top: 10rem; } .me-md-8{ margin-right: 10rem; } .mb-md-8{ margin-bottom: 10rem; } .m-md-9{ margin: 15rem; } .ms-md-9{ margin-left: 15rem; } .mt-md-9{ margin-top: 15rem; } .me-md-9{ margin-right: 15rem; } .mb-md-9{ margin-bottom: 15rem; } } @media (max-width: 1024px){ .m-6{ margin: 5rem; } .ms-6{ margin-left: 5rem; } .mt-6{ margin-top: 5rem; } .me-6{ margin-right: 5rem; } .mb-6{ margin-bottom: 5rem; } .m-7{ margin: 8rem; } .ms-7{ margin-left: 8rem; } .mt-7{ margin-top: 8rem; } .me-7{ margin-right: 8rem; } .mb-7{ margin-bottom: 8rem; } .m-8{ margin: 10rem; } .ms-8{ margin-left: 10rem; } .mt-8{ margin-top: 10rem; } .me-8{ margin-right: 10rem; } .mb-8{ margin-bottom: 10rem; } .m-9{ margin: 15rem; } .ms-9{ margin-left: 15rem; } .mt-9{ margin-top: 15rem; } .me-9{ margin-right: 15rem; } .mb-9{ margin-bottom: 15rem; } } .w-10{ width: 10%!important; } .w-20{ width: 20%!important; } .w-30{ width: 30%!important; } .w-40{ width: 40%!important; } .w-60{ width: 60%!important; } .w-70{ width: 70%!important; } .w-80{ width: 80%!important; } .w-90{ width: 90%!important; } .text-truncate-2{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 2!important; -webkit-box-orient: vertical!important; } .text-truncate-3{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 3!important; -webkit-box-orient: vertical!important; } .text-truncate-4{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 4!important; -webkit-box-orient: vertical!important; } .text-truncate-5{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 5!important; -webkit-box-orient: vertical!important; } .text-truncate-6{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 6!important; -webkit-box-orient: vertical!important; } .text-truncate-7{ overflow: hidden!important; display: -webkit-box!important; -webkit-line-clamp: 7!important; -webkit-box-orient: vertical!important; } .text-justify{ text-align: justify!important; } .radio-checkbox-form-control { display: block; width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; background-color: #fff; background-clip: padding-box; border: 1px solid transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } .radio-checkbox-form-control.is-invalid { border-color: #dc3545; padding-right: calc(1.5em + 0.75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } .radio-checkbox-form-control :last-child { margin-bottom: 0 !important; } @media (min-width: 1025px) { .d-pc { display: block; } .d-phone { display: none; } } @media (max-width: 1024px) { .d-pc { display: none; } .d-phone { display: block; } } /*按钮闪烁效果*/ .wyx-shine { position: relative; overflow: hidden; } .wyx-shine button::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); -webkit-transform: skewX(-30deg); transform: skewX(-30deg); } .wyx-shine button::before { -webkit-animation: shine 1.5s infinite; animation: shine 1.5s infinite; } @-webkit-keyframes shine { 100% { left: 120%; } } @keyframes shine { 100% { left: 120%; } } /*支付状态*/ .order-status-1, .order-status-30 { color: #FF0027; } .order-status-80, .order-status-90 { color: #ccc; } .order-status-10 { color: #F4AE1B; } .order-status-20, .order-status-40, .order-status-50, .order-status-60, .order-status-70 { color: #4ef817; } .qingchu{ margin: 0!important; padding: 0!important; } @font-face { font-family: Title; src: url('../../common/font/rs2hot/BreeSerif-Regular.ttf'); } @font-face { font-family: Mukta; src: url('../../common/font/rs2hot/Mukta-Regular.ttf'); } .ff-title { font-family: Title, sans-serif; } .ff-base { font-family: Mukta, sans-serif; } body{ font-family: Mukta,sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Neue,sans-serif; margin: 0; padding: 0; } input::placeholder{ color: #cccccc!important; } .text-a{ color: #e3e5ef!important; } .text-b{ color: #c1c1c1!important; } .text-c{ color: #ffbe18!important; } .text-d{ color: #dcdcdc!important; } .text-e{ color: #004d9b!important; } .text-f{ color: #2493ae!important; } .text-step{ color: #F3C827!important; } .text-ad{ color: #FF0027!important; } .bg-a{ background-color: #101520!important; } .bg-b{ background-color: #19202f!important; } .bg-c{ background-color: #05053d!important; } .bg-d{ background-color: #1d1d6c!important; } .bg-e{ background-color: #1c2024!important; } .bg-fee { background-color: #4FAE52!important; } .bg-title-img::before{ content: ""; position: absolute; left: 0; right: 0; height: 18px; bottom: -16px; width: 300px; margin: 0 auto; background: url("../images/title.png") center no-repeat; background-size: 100%; } .fs-1 { font-size: 2.5rem !important; } .fs-2 { font-size: 1.8rem !important; } .fs-3 { font-size: 1.2rem !important; } .fs-4 { font-size: 1.0rem !important; } .fs-5 { font-size: 0.9rem !important; } .fs-6 { font-size: 0.8rem !important; } .fs-7 { font-size: 0.7rem !important; } /*头部和底部，手机电脑端的显示与隐藏*/ @media (min-width: 1025px) { .d-pc { display: block; } .d-phone { display: none; } } @media (max-width: 1024px) { .d-pc { display: none; } .d-phone { display: block; } } a{ text-decoration: none; } header a{ color: #fff; } footer a{ color: #c1c1c1; } .footer-a a{ color: #fff; } header a:hover, footer a:hover, .footer-a a:hover{ color: #f3c827; } a.fpw-a{ color: #f5f5f5; } a.fpw-a:hover{ color: #fbb141; } a.light-a{ color: #e9e9e9!important; } a.light-a:hover{ color: #fbb141!important; } .js-initials-box button.active { background-color: #F4AE1B!important; border-color: #fff !important; color: #fff!important; } .js-initials-box button:not(.btn-check) + .btn:active { border-color: #fff; } .bg-zffs { width: 150px; height: 65px; background: url('../images/all-img.png') no-repeat; } .js-payment-icon-2, .js-payment-icon-3, .js-payment-icon-4, .js-payment-icon-5, .js-payment-icon-6, .js-payment-icon-7, .js-payment-icon-82{ background-position: 6px 2px; } .js-payment-icon-11 { background-position: -154px -248px; } .js-payment-icon-15 { background-position: 4px -355px; } .js-payment-icon-17 { background-position: 6px -299px; } .js-payment-icon-69 { background-position: 8px -60px; } .js-payment-icon-70 { background-position: 22px -118px; } .js-payment-icon-71 { background-position: 22px -178px; } .js-payment-icon-73 { background-position: 6px -240px; } .js-payment-icon-77{ background-position: 4px -413px; } .js-payment-icon-78{ background-position: -162px -56px; } .js-payment-icon-79{ background-position: -145px -117px; } .js-payment-icon-80{ background-position: -158px -184px; } .js-payment-icon-ideal{ background-position: 8px -476px; } .js-payment-icon-sepa{ background-position: 6px -535px; } .js-payment-icon-giropay{ background-position: -146px 2px; } .js-payment-icon-many{ background-position: -158px -248px; } /*支付状态*/ .order-status-1, .order-status-30 { color: #FF0027; } .order-status-80, .order-status-90 { color: #ccc; } .order-status-10 { color: #F4AE1B; } .order-status-20, .order-status-40, .order-status-50, .order-status-60, .order-status-70 { color: #4ef817; } .nav-link:hover{ background-color: #4D4D5C!important; } @media (min-width: 768px) { .border-why{ border-color: #3d3644!important; } } @media (max-width: 767px) { .border-why{ border:none!important; } } .border-a{ border-color: #252c3b!important; } .border-b{ border-color: #3b455e!important; } .border-c{ border-color: #FBCF1C!important; } .breadcrumb { --bs-breadcrumb-divider-color: #fff; } .top_class{ background: rgba(22, 33, 42, 0.80); } .gold-qty-invalid.form-control.is-invalid, .was-validated .form-control:invalid { background-position: right calc(2.3em + 0.1875rem) center; } .btn-a{ background: #ce9935 !important; color: #000 !important; border: none!important; } .btn-a:hover, .btn-a:active, .btn-a.show{ background: #f4b439!important; color: #343434 !important; box-shadow: 0 0.2rem 0.5rem rgba(244,180,57,.6)!important; border: none!important; } .btn-b{ color: #fff!important; } .btn-b:hover, .btn-b.show, .btn-b:active{ color: #fff!important; background-color: #252c3b!important; } .btn-c{ color: #ccc!important; border: none!important; background: #003b7a !important; } .btn-c:hover, .btn-c.show, .btn-c:active{ background: #004d9b!important; color: #fff!important; box-shadow: 0 0.2rem 0.5rem rgba(0,77,155,.8)!important; border: none!important; } .btn-d{ color: #fff!important; background-color: #222938!important; } .btn-d:hover, .btn-d.show, .btn-d:active{ color: #fff!important; background-color: #2f384d!important; } .btn-login{ background: #004d9b!important; color: #fff!important; border: none!important; } .btn-login:hover, .btn-login:active, .btn-login.show{ background: #004d9b!important; color: #fff!important; box-shadow: 0 0.2rem 0.5rem rgba(0,77,155,.8)!important; border: none!important; } .btn-save{ background: #f4b439!important; color: #343434 !important; border: none!important; } .btn-save:hover, .btn-save:active, .btn-save.show{ background: #f4b439!important; color: #343434 !important; box-shadow: 0 0.2rem 0.5rem rgba(244,180,57,.6)!important; border: none!important; } .btn-cate{ color: #e3e5ef!important; border: 1px solid #252c3b!important; background-color: #101520!important; } .btn-cate:hover, .btn-cate:active, .btn-cate.show, .btn-cate-active{ color: #ffbe18!important; border: 1px solid #FBCF1C!important; background-color: #101520!important; } .btn-e{ background: #2d3740!important; color: #fafafa!important; } .btn-e:hover, .btn-e.show, .btn-e:active{ color: #fafafa!important; background: #1a76d2!important; } .btn-f{ color: #fff!important; background-color: #1a76d2!important; } .shadow-a{ box-shadow: -5px 5px 5px -5px rgba(0,0,0,0.48); } .currency a{ color: #ccc!important; border: 1px solid #566879!important; } .currency a:hover{ color: #fff!important; border: 1px solid #fff!important; } a.lang{ color: #ccc!important; } a.lang:hover{ color: #fff!important; background-color: #566879!important; } .lg-quick .dropdown-item.active, .lg-quick .dropdown-item:active { color: var(--bs-dropdown-link-active-color); text-decoration: none; background-color: #4D4D5C!important; } .lg-quick .dropdown-item:focus, .lg-quick .dropdown-item:hover { color: var(--bs-dropdown-link-hover-color); background-color: #19202f!important; } .page-link{ color: #fff!important; background-color: transparent!important; border: none!important; } .page-link:focus{ box-shadow: 0 0 0 0!important; } .active>.page-link, .page-link.active, .page-link:hover { color: #f00!important; } .disabled>.page-link{ color: #999999!important; } .website-cart .dropdown-item:focus, .website-cart .dropdown-item:hover, .website-cart .dropdown-item.active, .website-cart .dropdown-item:active { color: #fff!important; background-color: #19202f!important; } .description-box { width: 380px; font-size: 0.9rem; } .description-box table { width: 100%; } .description-box h2 { margin: 0; font-size: 1rem; text-align: center; background-color: #111; padding: 10px 0; } .description-box td { text-align: center; width: 50%; } .bg-table { background: #24211C; } .description-box a { color: #3fbddd; } .description-box img { height: 120px !important; } /*按钮闪烁效果*/ .wyx-shine { position: relative; overflow: hidden!important; } .wyx-shine button::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); -webkit-transform: skewX(-30deg); transform: skewX(-30deg); } .wyx-shine button::before { -webkit-animation: shine 1.5s infinite; animation: shine 1.5s infinite; } .bg-top-img{ background: url('../images/runescape-3.jpg') no-repeat; } @media screen and (max-width: 768px) { .home-banner-box{ height: 120px; } } @media screen and (min-width: 769px) and (max-width: 1024px) { .home-banner-box{ height: 250px; } } @media screen and (min-width: 1024px) and (max-width: 1100px) { .home-banner-box{ height: 320px; } } @media screen and (min-width: 1100px) and (max-width: 1280px) { .home-banner-box{ height: 380px; } } @media screen and (min-width: 1280px) and (max-width: 1536px) { .home-banner-box{ height: 440px; } } @media screen and (min-width: 1536px) and (max-width: 1745px) { .home-banner-box{ height: 520px; } } @media screen and (min-width: 1745px){ .home-banner-box{ height: 568px; } } .js-item-box{ transition: all 0.3s; /*box-shadow: 0 0.3rem 0.7rem rgba(12,133,234,.15)!important;*/ } .js-item-box:hover{ transition: all 0.3s; box-shadow: 0 0.8rem 1.5rem rgba(12,133,234,.25)!important; border-color: #3b455e !important; } .js-item-box img{ transition: all 0.3s; } .js-item-box:hover img{ transition: all 0.3s; transform: scale(1.1); } .shadow-header{ box-shadow: 0 0.2rem 0.5rem rgba(12,133,234,.1)!important; } .nba-checkout-dropdown span{ color: #e3e5ef!important; } .nba-checkout-dropdown .dropdown-item:focus, .nba-checkout-dropdown .dropdown-item:hover, .nba-checkout-dropdown .dropdown-item.active, .nba-checkout-dropdown .dropdown-item:active{ color: #fff; background-color: #19202f!important; } .nba-checkout-dropdown::-webkit-scrollbar{ width: 10px; } .nba-checkout-dropdown::-webkit-scrollbar-track { background: #19202f; } .nba-checkout-dropdown::-webkit-scrollbar-thumb { background: #d0d0d0; } .nba-checkout-dropdown::-webkit-scrollbar-thumb:window-inactive { background: #555; } .js-btm img{ opacity: 0.5; transition: all 0.3s; } .js-btm:hover img{ opacity: 1; transition: all 0.3s; } .js-wzfg .text-shadow-a{ text-shadow: 0 0 0 0; } .js-wzfg:hover .text-shadow-a{ text-shadow: 0 0.2rem 0.5rem rgba(0,77,155,.8)!important; } .js-fangda img{ transition: all 0.3s; } .js-fangda:hover img{ transition: all 0.3s; transform: scale(1.1); } .js-faguang{ transition: all 0.3s; box-shadow: 0 0 0 0; } .js-faguang:hover{ transition: all 0.3s; box-shadow: 0 0.2rem 0.5rem rgba(255,255,0,.6)!important; } @media screen and (min-width: 768px) { .osrs{ margin-top: -54px; } } @media screen and (max-width: 769px) { .osrs{ margin-top: 0; } } @media screen and (min-width: 768px) { .rs-3{ margin-top: -54px; } } @media screen and (max-width: 769px) { .rs-3{ margin-top: 0; } }