修改

dev/static/font/cavan.css

 @font-face {
     font-family: 'SemiBold';
     src: url('./CrimsonText-SemiBold-6.ttf') format('truetype');
+}
+@font-face {
+    font-family: 'DIN-Medium';
+    src: url('./DIN-Medium-2.otf') format('truetype');
 }

src/pages/HogoodCoffee/index.html

 
                 </video>
             </div>
+            <img class="yezi" src="../static/images/hgkf/yezi.png" alt="">
         </div>
 
     </div>

src/pages/HogoodCoffee/index.less

     }
 
     .logo {
+        transform: scale(.8);
         width: 339px;
         height: 106px;
         background: url("../common/images/hgkf.png") no-repeat center;
         .contents{
             width: 1300px;
             margin: 0 auto;
-            line-height: 1.5;
+            line-height: 50px;
             font-size: 26px;
             color: #000;
             .flexBox{
                 font-family: "思源";
                 padding-right: 25px;
                 span{
-                    font-family: "DINBOLD";
+                    font-weight: 400;
+                    font-family: "DIN-Medium";
+                    white-space: nowrap;
                 }
             }
             .p5{
         width: 100%;
         height: 920px;
         max-width: 1920px;
-        background: url("../common/images/tbBj.png") no-repeat center;
-        background-size: 1920px 838px;
-        background-position: 0 0;
+        // background: url("../common/images/tbBj.png") no-repeat center;
+        // background-size: 1920px 838px;
+        // background-position: 0 0;
+        position: relative;
 
+        .budai{
+            position: absolute;
+            width: 167px;
+            height: 150px;
+            left: 0;
+            bottom: 120px;
+        }
+        .yezi{
+            position: absolute;
+            width: 186px;
+            height: 440px;
+            right: 0;
+            top: 0;
+        }
         .title {
             font-size: 70px;
             color: #000000;
 }
 
 
-
+@media screen and (min-width: 1500px) and (max-width: 1900px) {
+    .hg-header{
+        .headerPC{
+            height: 80px;
+            padding: 0 50px;
+        }
+        .logo{
+            transform: scale(0.7);
+        }
+        .menu {
+            &>div {
+                &>a {
+                    font-size: 20px;
+                }
+            }
+        }
+    }
+    .main{
+        
+        .chart{
+            background-size: 100% auto;
+            .tbGif{
+                width: 80%;
+                height: auto;
+            }
+        }
+    }
+}
 @media screen and (min-width: 1300px) and (max-width: 1600px) {
     .hg-header{
         .headerPC{
+            height: 80px;
+            
             padding: 0 50px;
         }
         .logo{
-            transform: scale(0.5);
+            transform: scale(0.7);
+            margin-left: -135px;
         }
         .menu {
             &>div {
                 &>a {
-                    font-size: 16px;
+                    font-size: 20px;
                 }
             }
         }
     }
     .main{
+        .content{
+            .contents{
+                width: 95%;
+                .p6{
+                    font-size: 22px;
+                    white-space: nowrap;
+                }
+                .p3{
+                    width: 600px;
+                }
+                .p5{
+                    width: 1100px;
+                }
+                .p4{
+                    padding-right: 0;
+                }
+            }
+        }
         .chart{
             background-size: 100% auto;
             .tbGif{
 @media screen and (min-width: 801px) and (max-width: 1300px) {
     .hg-header{
         .headerPC{
+            height: 80px;
             padding: 0 50px;
         }
         .logo{
-            transform: scale(0.5);
+            transform: scale(0.7);
+            margin-left: -115px;
         }
         .menu {
             &>div {
                 &>a {
-                    font-size: 16px;
+                    font-size: 18px;
                 }
             }
         }
     }
     .main{
+        .atlas{
+            .atlasCon{
+                width: 95%;
+                    margin: 0 auto;
+                .imgCon{
+                    
+                    .imgLi{
+                        height: auto;
+                        width: calc(50% - 20px);
+                    }
+                }
+            }
+        }
+        .content{
+            .contents{
+                width: 95%;
+                .p6{
+                    font-size: 22px;
+                }
+                .p2{
+                    img{
+                        transform: scale(0.8);
+                    }
+                }
+            }
+        }
         .chart{
             background-size: 100% auto;
             .tbGif{
             }
         }
     }
+    .banner{
+        .bannerSwiper{
+            transform: scale(0.8);
+        }
+        .btn-prev,
+        .btn-next{
+            top: 283px;
+            transform: scale(0.8);
+
+        }
+        .btn-prev{
+            margin-left: -525px;
+        }
+        .btn-next{
+            margin-left:445px ;
+        }
+    }
 
 }