header { position: relative; } .scroll-menu { font-size: 14px; padding: 4px 0 0 0; ul { height: 48px; outline: none; } li { border-right: 1px solid $border_dark; white-space: nowrap; &:last-child { border-right: none; } } a { display: block; padding: 8px 16px; } } .scroll-menu .flickity-page-dots { bottom: -2px; } .scroll-menu .flickity-page-dots .dot { border-radius: 4px; height: 3px; margin: 0; width: 36px; } .header-inner { height: 280px; padding: 48px 8px 0 8px; text-align: center; } .header-cover { img { background-size: cover; -webkit-filter: brightness(75%); filter: brightness(75%); height: 300px; position: absolute; top: 0; width: auto; //mobile z-index: -1; } } .breadcrumb { padding: 0 8px 24px 8px; ol { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } li { padding: 0 8px 0 0; } } @include media(sp) { .scroll-menu .flickity-page-dots { bottom: -12px; } .site-title { font-size: 20px; } } @include media(pc) { .header-cover img { width: 100%; } }