@font-face {
    font-family: 'SourceHanSansJP';
    src: url('../font/SourceHanSansJP-ExtraLight.otf') format('opentype'), url('./font/SourceHanSansJP-ExtraLight.woff2') format('woff2'), url('./font/SourceHanSansJP-ExtraLight.woff') format('woff');
}

html {
    background: #dddddd;
    scroll-padding-top: 60px;
}

body {
    min-width: 360px;
    max-width: 480px;
    margin: 0 auto;
    position: relative;
    width: 100%;
}

.top {
    top: 0;
}

.bottom {
    bottom: 0;
}

.left {
    left: 0;
}

.right {
    right: 0;
}

.middle {
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

.pc {
    display: block !important;
}

.sp {
    display: none !important;
}

@media only screen and (max-width:750px) {
    .pc {
        display: none !important
    }
    .sp {
        display: block !important
    }
}