*{margin: 0; padding: 0; box-sizing: border-box;}


@media (max-width: 1199.98px) {
    .pc-show{display: none;}
   .block{ width: 100%; min-height: 100vh; background-image: url(../images/mobile-bg.png); background-size: cover; overflow: hidden; position: relative; padding-top: 66vw; padding-bottom: 10vw;}
   .kv{ width: 75.2vw; top: 7.6vw; left: 14.6vw; position: absolute;}   
   .logo{position: absolute; top: 6.6vw; width: 50vw; right: -10vw;}
   .video-box{ width: 90vw; height: 50.4vw;position: relative; z-index: 2;border: 3px solid #00f2ff; margin: 0 auto;}
   .video-box video{ width: 100%; height: 100%;}
   .title{ width: 95vw; display: block; margin: 0 auto; margin-top: 4vw;}
   .steam-btn{width: 68vw; display: block; margin: 0 auto; margin-top: 5.7vw;}


}

@media (min-width: 1200px) and (max-width: 1919.98px) {
    .mobile-show{display: none;}
    .block{width: 100%; height: 100vh; background-image: url(../images/bg.png); background-size: cover; position: relative;}
    .kv{position: absolute; bottom:0; right: 0; width: 620px;}
    .logo{position:absolute; top: 5px; left: 5px; width: 300px;}
    .video-box{ width: 632px; height: 360px; border: 3px solid #00f2ff; position: absolute; top: 180px; left: 180px; background-color: #000;}
    .video-box video{ width: 100%; height: 100%; }
    .title{ width: 700px; position: absolute; top: 555px; left: 135px;}
    iframe{ width: 676px; height: 215px;  border: none; position: absolute; left: 150px; top: 800px;}


}
@media (min-width: 1920px) and (max-width: 2049.98px) {
    .mobile-show{display: none;}
    .block{width: 100%; height: 100vh; background-image: url(../images/bg.png); background-size: cover; position: relative;}
    .kv{position: absolute; bottom:0; right: 0; width: 630px;}
    .logo{position:absolute; top: 56px; left: 70px; width: 425px;}
    .video-box{ width: 792px; height: 430px; border: 3px solid #00f2ff; position: absolute; top: 300px; left: 300px; background-color: #000;}
    .video-box video{ width: 100%; height: 100%; }
    .title{ width: 792px; position: absolute; top: 745px; left: 300px;}
    iframe{ width: 676px; height: 215px;  border: none; position: absolute; left: 360px; top: 1000px;}

}

@media (min-width: 2050px)  {
    .mobile-show{display: none;}
    .block{width: 100%; height: 100vh; background-image: url(../images/bg.png); background-size: cover; position: relative;}
    .kv{position: absolute; bottom:0; right: 0; width: 900px;}
    .logo{position:absolute; top: 56px; left: 70px; width: 425px;}
    .video-box{ width: 792px; height: 430px; border: 3px solid #00f2ff; position: absolute; top: 300px; left: 300px; background-color: #000;}
    .video-box video{ width: 100%; height: 100%; }
    .title{ width: 792px; position: absolute; top: 745px; left: 300px;}
    iframe{ width: 676px; height: 215px;  border: none; position: absolute; left: 360px; top: 1000px;}
}