body { background-color: black; } /* Phone */ @media only screen and (max-width: 750px) { body { margin: 0; padding: 0; } .container { margin: 0; padding: 0; max-width: 1200px; margin: 0 auto; background-size: cover; background-repeat: no-repeat; background-position: center; height: auto; aspect-ratio: 750 / 1635; display: block; object-fit: contain; } .top-floating { top: 0; left: 0; width: 100vw; aspect-ratio: 750 / 118; z-index: 99; position: fixed; text-align: center; background-size: cover; background-position: center center; background-repeat: no-repeat; } .top-floating img { float: right; margin-top: 1vh; } .btn_click { height: 55px; display: flex; overflow: hidden; position: absolute; top: calc(63vh - 1px); margin: 0 10px; } .btn_click img { width: 94vw; height: auto; z-index: 1; } } /* PC */ @media only screen and (min-width: 768px) { body { padding: 0; margin: 0 25vw; background-color: rgba(26, 1, 2, 1); } .container { margin: 0; padding: 0; height: auto; aspect-ratio: 750 / 1635; background-size: cover; background-position: center; background-repeat: no-repeat; } .top-floating { top: 0; z-index: 99; position: fixed; text-align: center; background-size: cover; height: 94px; width: 750px; background-position: center center; background-repeat: no-repeat; } .top-floating img { float: right; margin-top: 1vh; margin-right: 1vw; } .btn_click { height: 55px; display: flex; margin: 0 8px; overflow: hidden; position: absolute; top: calc(70vh - 1px); width: calc(30vw - 20px); } .btn_click img { width: 94vw; height: auto; } }