/*PC*/
@media print, screen and (min-width: 768px) {
#loading-screen {
position: fixed;
top: 400px;
left: 0;
width: 100%;
height: calc(100% - 400px);
background: #121212;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
z-index: 9999;
}

#loading-bar-container {
width: 100%;
height: 1px;
background: #FFF;
overflow: hidden;
margin-bottom: 20px;
}

#loading-bar {
width: 0%;
height: 100%;
background: #0084c0;
transition: width 0.3s;
}

#loading-percentage {
font-size: 24px;
color: #FFF;
}


}
/*SP*/
@media print, screen and (max-width: 767px) {
#loading-screen {
position: fixed;
top: 350px;
left: 0;
width: 100%;
height: calc(100% - 350px);
background: #121212;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
z-index: 9999;
}

#loading-bar-container {
width: 100%;
height: 1px;
background: #FFF;
overflow: hidden;
margin-bottom: 20px;
}

#loading-bar {
width: 0%;
height: 100%;
background: #0084c0;
transition: width 0.3s;
}

#loading-percentage {
font-size: 24px;
color: #FFF;
}
}