:root, body {
  --pc-content-width: min(100vw, 1920px);
  --sp-content-width: 100vw;
}

@media screen and (min-width: 1280px) {
  .spp__container {
    --pc-content-width: min(calc(100vw - 144px), 1776px);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .spp__container {
    --pc-content-width: calc(100vw - 128px);
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .spp__container {
    --sp-content-width: calc(100vw - 88px);
  }
}
@media screen and (min-width: 540px) and (max-width: 767px) {
  .spp__container {
    --sp-content-width: calc(100vw - 72px);
  }
}
@media screen and (min-width: 480px) and (max-width: 539px) {
  .spp__container {
    --sp-content-width: calc(100vw - 56px);
  }
}
@media screen and (max-width: 479px) {
  .spp__container {
    --sp-content-width: calc(100vw - 40px);
  }
}

.section_lineup {
  position: relative;
  color: #1a1a1a;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
@media screen and (min-width: 1024px) {
  .section_lineup {
    width: calc(0.9244791667 * var(--pc-content-width));
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}
@media screen and (max-width: 1023px) {
  .section_lineup {
    display: none;
  }
}
.section_lineup p, .section_lineup dl, .section_lineup dt, .section_lineup dd, .section_lineup h2 {
  margin: 0;
}
@media screen and (max-width: 1023px) {
  .section_lineup .pc {
    display: none !important;
  }
}
@media screen and (min-width: 1024px) {
  .section_lineup .sp {
    display: none !important;
  }
}

.hob-lineup_contents {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  background: #fafafa;
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents {
    width: calc(0.221875 * var(--pc-content-width));
    height: calc(0.234375 * var(--pc-content-width));
    padding-top: calc(0.0208333333 * var(--pc-content-width));
    padding-bottom: calc(0.0208333333 * var(--pc-content-width));
    border-radius: calc(0.0166666667 * var(--pc-content-width));
    -moz-column-gap: calc(0.0208333333 * var(--pc-content-width));
    column-gap: calc(0.0208333333 * var(--pc-content-width));
    overflow: hidden;
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents {
    width: calc(0.7333333333 * var(--sp-content-width));
    height: calc(0.776 * var(--sp-content-width));
    margin: 0 auto;
    padding-top: calc(0.08 * var(--sp-content-width));
    padding-bottom: calc(0.0746666667 * var(--sp-content-width));
    border-radius: calc(0.0426666667 * var(--sp-content-width));
    -moz-column-gap: calc(0.0533333333 * var(--sp-content-width));
    column-gap: calc(0.0533333333 * var(--sp-content-width));
  }
}
.hob-lineup_contents p, .hob-lineup_contents dl, .hob-lineup_contents dt, .hob-lineup_contents dd, .hob-lineup_contents h2, .hob-lineup_contents h3 {
  margin: 0;
}
.hob-lineup_contents a {
  color: #1a1a1a;
}
.hob-lineup_contents a:hover {
  color: #1a1a1a;
  opacity: 0.8;
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .pc {
    display: none !important;
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .sp {
    display: none !important;
  }
}
.hob-lineup_contents .hob-lineup_link {
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  justify-content: flex-start;
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_link {
    justify-content: flex-end;
    padding-bottom: calc(0.0586666667 * var(--sp-content-width));
  }
}
.hob-lineup_contents .hob-lineup_link_foundations {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_link_foundations {
    align-items: center;
    gap: calc(0.0208333333 * var(--pc-content-width));
    padding-left: calc(0.0104166667 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_link_foundations {
    align-items: baseline;
    gap: calc(0.0533333333 * var(--sp-content-width));
    padding-left: calc(0.0266666667 * var(--sp-content-width));
  }
}
.hob-lineup_contents .hob-lineup_category {
  width: 100%;
  text-align: center;
  line-height: 150%;
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_category {
    font-size: calc(0.0145833333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_category {
    font-size: calc(0.0426666667 * var(--sp-content-width));
  }
}
.hob-lineup_contents .hob-lineup_item {
  text-align: center;
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
}
.hob-lineup_contents .hob-lineup_item_image {
  display: block;
  width: 100%;
  margin: 0 auto;
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-1 {
    width: calc(0.0401041667 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-1 {
    width: calc(0.1333333333 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-2 {
    width: calc(0.0395833333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-2 {
    width: calc(0.1306666667 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-3 {
    width: calc(0.0401041667 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-01-3 {
    width: calc(0.1333333333 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-02-1 {
    width: calc(0.0395833333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-02-1 {
    width: calc(0.1306666667 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-02-2 {
    margin-top: calc(0.0338541667 * var(--pc-content-width));
    width: calc(0.0833333333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-02-2 {
    width: calc(0.2746666667 * var(--sp-content-width));
    margin-bottom: calc(-0.0106666667 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-03-1 {
    margin-top: calc(-0.0052083333 * var(--pc-content-width));
    width: calc(0.0734375 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-03-1 {
    width: calc(0.2426666667 * var(--sp-content-width));
    margin-bottom: calc(0.0213333333 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-04-1 {
    margin-top: calc(0.0088541667 * var(--pc-content-width));
    width: calc(0.0666666667 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_image.lineup-item-04-1 {
    width: calc(0.2213333333 * var(--sp-content-width));
  }
}
.hob-lineup_contents .hob-lineup_item_link {
  text-decoration: underline;
  line-height: 1;
  color: #1a1a1a;
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 7.5em;
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents .hob-lineup_item_link {
    font-size: calc(0.0083333333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents .hob-lineup_item_link {
    font-size: calc(0.0293333333 * var(--sp-content-width));
  }
}
@media screen and (min-width: 1024px) {
  .hob-lineup_contents.hob-lineup_contents_01 {
    -moz-column-gap: calc(0.0338541667 * var(--pc-content-width));
    column-gap: calc(0.0338541667 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .hob-lineup_contents.hob-lineup_contents_01 {
    -moz-column-gap: calc(0.1013333333 * var(--sp-content-width));
    column-gap: calc(0.1013333333 * var(--sp-content-width));
  }
}