body {
       min-height: 1024px;
   }

   .nav-fixed {
       position: fixed;
       top: 0;
       left: 0;
       right: 0;
       z-index: 1000;
       background: rgba(255, 255, 255, 0.95);
       backdrop-filter: blur(5px);
   }

   .hero-section {
       background-image: url('https://mastergo.com/ai/api/search-image?query=A professional and modern LNG fuel system on a large commercial vessel, with a dramatic sunset backdrop. The image shows advanced technology integration with clean, minimalist industrial design. The lighting creates a perfect balance between highlighting the technical details and maintaining an atmospheric mood. The background smoothly transitions from deep blue to warm orange tones, ensuring text readability on the left side.&width=1920&height=880&orientation=landscape');
       background-size: cover;
       background-position: center;
       position: relative;
   }

   .hero-overlay {
       background: linear-gradient(90deg, rgba(0, 64, 139, 0.9) 0%, rgba(0, 64, 139, 0.7) 50%, rgba(0, 64, 139, 0.4) 100%);
   }

   .floating-contact {
       position: fixed;
       right: 20px;
       top: 50%;
       transform: translateY(-50%);
       z-index: 1000;
   }

   .floating-contact-item {
       width: 50px;
       height: 50px;
       background: #0056b3;
       margin: 10px 0;
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
       cursor: pointer;
       transition: all 0.3s;
       color: white;
   }

   .floating-contact-item:hover {
       background: #00264d;
       color: white;
   }

   .modal {
       display: none;
       position: fixed;
       z-index: 1000;
       left: 0;
       top: 0;
       width: 100%;
       height: 100%;
       overflow: auto;
   }

   .modal-content {
       background-color: #fefefe;
       margin: 15% auto;
       padding: 0px;
       border: 0px solid #888;
       width: 80%;
       max-width: 200px;
       text-align: center;
   }

   .your-div {
       /* 先设置div的一些基础样式，这里仅为示例，你可按需调整 */
       margin-bottom: 10px;
   }

   .your-div:hover {
       cursor: pointer;
       /* 鼠标悬停时指针变为手型 */
   }

   #google_translate_element {
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 9999;
    }
    
   .product-card:hover {
       transform: translateY(-5px);
       transition: transform 0.3s ease;
   }

   .partner-logo {
       filter: grayscale(1);
       transition: filter 0.3s ease;
   }

   .partner-logo:hover {
       filter: grayscale(0);
   }

   .merged-menu {
       position: absolute;
       display: none;
       width: 300px;
       background-color: white;
       box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
       border-radius: 0.5rem;
       padding: 1rem;
       margin-top: 0.5rem;
       z-index: 50;
       left: -80px;
       flex-direction: column;
       gap: 1rem;
   }

   .group:hover .merged-menu {
       display: flex;
   }

   .menu-item {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       padding: 0.5rem;
       border-radius: 0.5rem;
   }

   .menu-item:hover {
       background-color: #f9fafb;
   }

   .menu-item-image-container {
       width: 3rem;
       height: 3rem;
       border-radius: 9999px;
       overflow: hidden;
   }

   .menu-item-image {
       width: 100%;
       height: 100%;
       object-fit: cover;
   }

   .menu-item-text {
       color: #4b5563;
       white-space: nowrap;
   }

   .menu-item-text:hover {
       color: #1d4ed8;
   }

   :root {
       --primary-color: #1d4ed8;
   }

   .product-card:hover {
       transform: scale(1.05);
       transition: transform 0.3s ease-in-out;
   }

   button:hover {
       filter: brightness(1.1);
   }

   img {
       max-width: none;
   }

   .pagination {
       display: flex;
       justify-content: center;
       list-style-type: none;
       padding: 0;
       margin-top: 20px;
   }

   .pagination li {
       margin: 0 5px;
   }

   .pagination li a,
   .pagination li span {
       width: 2rem;
       height: 2rem;
       display: flex;
       align-items: center;
       justify-content: center;
       border: 1px solid #d1d5db;
       color: #4b5563;
       border-radius: 0.25rem;
       text-decoration: none;
       transition: all 0.3s;
   }

   .pagination li a:hover,
   .pagination li span:hover {
       border-color: #3b82f6;
       color: #3b82f6;
   }

   .qqzl h3 {
       font-size: 36px;
       color: #3a3a3a;
       margin-bottom: 38px;
       margin-top: 25px;
       text-align: center;
       display: block;
   }



   .qqzl p {
       font-size: 16px;
       color: #666;
       line-height: 35px;
       margin-top: 20px;
       text-align: center;
   }



   .qqzl span {
       font-size: 18px;
       color: #00408b;
       font-weight: bold;
       line-height: 34px;
   }







   .qqzldt {
       background: url(../images/global03_1.png) no-repeat center;
       height: 500px;
       width: 100%;
       position: relative;
   }



   .qqyxf {
       position: absolute;
       right: 0px;
       top: 100px;
       background: rgba(0, 64, 139, 0.9);
       width: 520px;
       padding: 50px 80px;
   }



   .qqyxf h3 {
       font-size: 24px;
       color: #fff;
       line-height: 80px;
       font-weight: normal;
   }



   .qqyxf p {
       float: left;
       font-size: 14px;
       color: #fff;
       width: 50%;
   }



   .qqyxf p b {
       font-size: 24px;
       font-weight: bold;
       color: #facd00
   }



   .qqyxf span {
       padding-top: 50px;
       color: #fff;
       font-size: 18px;
   }











   .qqzldt .dot_box {
       position: absolute;
       left: 0;
       bottom: 0;
       width: 100%;
       height: 100%;
   }



   .qqzldt .dot_box .dot {
       position: absolute;
   }



   .qqzldt .dot_box .dot .dot_circle {
       display: block;
       width: 14px;
       height: 14px;
       background: #00479d;
       position: relative;
       z-index: 3;
       border-radius: 50%;
   }



   .qqzldt .dot:after,



   .qqzldt .dot:before {
       content: "";
       position: absolute;
       border-radius: 50%;
       top: 50%;
       left: 50%;
       z-index: 1;
   }



   .qqzldt .dot:before {
       width: 29px;
       height: 29px;
       background: transparent;
       background: rgba(0, 71, 157, 0.3);
       margin-top: -14px;
       margin-left: -14px;
       -webkit-animation: warn 2s linear 0.4s infinite;
       -moz-animation: warn 2s linear 0.4s infinite;
       animation: warn 2s linear 0.4s infinite;
       opacity: 0;
   }



   .qqzldt .dot:after {
       width: 46px;
       height: 46px;
       background: transparent;
       /*background:#7e9ec3;*/
       background: rgba(0, 71, 157, 0.2);
       margin-left: -23px;
       margin-top: -23px;
       -webkit-animation: warn 2s linear 0s infinite;
       -moz-animation: warn 2s linear 0s infinite;
       animation: warn 2s linear 0s infinite;
       opacity: 0;
   }







   @keyframes warn {
       0% {
           transform: scale(0.5);
           opacity: 0;
       }

       25% {
           transform: scale(1);
           opacity: 0.4;
       }

       50% {
           transform: scale(1.2);
           opacity: 0.8;
       }

       75% {
           transform: scale(1.3);
           opacity: 0.4;
       }

       100% {
           transform: scale(1.4);
           opacity: 0;
       }
   }



   @-webkit-keyframes warn {
       0% {
           transform: scale(0.5);
           opacity: 0;
       }

       25% {
           transform: scale(1);
           opacity: 0.4;
       }

       50% {
           transform: scale(1.2);
           opacity: 0.8;
       }

       75% {
           transform: scale(1.3);
           opacity: 0.4;
       }

       100% {
           transform: scale(1.4);
           opacity: 0;
       }
   }







   .qqzldt .dot_box .dot:nth-child(1) {
       left: 15%;
       top: 230px;
   }



   .qqzldt .dot_box .dot:nth-child(2) {
       left: 15%;
       top: 180px;
   }



   .qqzldt .dot_box .dot:nth-child(3) {
       left: 20%;
       top: 240px;
   }



   .qqzldt .dot_box .dot:nth-child(4) {
       left: 23%;
       top: 210px;
   }



   .qqzldt .dot_box .dot:nth-child(5) {
       left: 18%;
       top: 100px;
   }



   .qqzldt .dot_box .dot:nth-child(6) {
       left: 9%;
       top: 255px;
   }



   .qqzldt .dot_box .dot:nth-child(7) {
       left: 38%;
       top: 200px;
   }



   .qqzldt .dot_box .dot:nth-child(8) {
       left: 28%;
       top: 240px;
   }



   .qqzldt .dot_box .dot:nth-child(9) {
       left: 25%;
       top: 140px;
   }



   .qqzldt .dot_box .dot:nth-child(10) {
       left: 40%;
       top: 200px;
   }



   .qqzldt .dot_box .dot:nth-child(11) {
       left: 30%;
       top: 95px;
   }



   .qqzldt .dot_box .dot:nth-child(12) {
       left: 38%;
       top: 420px;
   }



   .qqzldt .dot_box .dot:nth-child(13) {
       left: 16%;
       top: 450px;
   }

   .qqzldt .dot_box .dot:nth-child(14) {
       left: 13%;
       top: 300px;
   }



   .qqzldt .dot_box .dot:nth-child(15) {
       left: 36%;
       top: 340px;
   }



   .qqzldt .dot_box .dot:nth-child(16) {
       left: 33%;
       top: 280px;
   }