body[data-page="/hiwashistory/"] {
  background: #dfdfdd;
  color: #131d66
}

body[data-page="/hiwashistory/"] .page-hero {
  background: #a09d94;
  color: #fff
}

body[data-page="/hiwashistory/"] .page-hero .title-line {
  border-color: #fff
}

body[data-page="/hiwashistory/"] .page-hero .title-line span {
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff
}

body[data-page="/hiwashistory/"] .page-hero h1,body[data-page="/hiwashistory/"] .page-hero .breadcrumb,body[data-page="/hiwashistory/"] .page-hero .breadcrumb a {
  color: #fff
}

body[data-page="/hiwashistory/"] .page-hero h1 {
  font-family: "Story Shippori Mincho","Yu Mincho",serif
}

.story-carousel {
  overflow: hidden;
  background: #131d66
}

.story-carousel-track {
  display: flex;
  width: max-content;
  animation: story-carousel-flow 32s linear infinite
}

.story-carousel-group {
  display: flex;
  flex: none
}

.story-carousel-group img {
  width: 33.333333vw;
  height: 300px;
  flex: none;
  display: block;
  object-fit: cover
}

@keyframes story-carousel-flow {
  from {
    transform: translateX(0)
  }
  to {
    transform: translateX(-50%)
  }
}

.story-meaning {
  padding: 100px 0;
  background: #a09d94;
  color: #fff
}

.story-meaning h2 {
  font-family: "Story Shippori Mincho","Yu Mincho",serif;
  font-size: 36px;
  line-height: 1.6;
  font-weight: 700;
  border-left: 2px solid currentColor;
  padding: 14px 0 14px 36px;
  margin: 0 0 45px
}

.story-body {
  font-size: 18px;
  line-height: 2
}

.story-body p {
  margin: 0;
  overflow-wrap: anywhere
}

.story-team {
  padding: 80px 0 0
}

.story-team img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px
}

.story-origin {
  padding: 100px 0 60px
}

.story-origin-grid {
  display: grid;
  grid-template-columns: 400px minmax(0,1fr);
  gap: 80px;
  align-items: center
}

.story-helmet {
  width: 100%;
  height: auto;
  border-radius: 8px
}

.story-work-photo {
  display: block;
  width: 480px;
  max-width: 75%;
  height: auto;
  margin: 50px auto 0;
  border-radius: 8px
}

@media(max-width:1000px) {
  .story-origin-grid {
    grid-template-columns: 35% minmax(0,1fr);
    gap: 45px
  }
}

@media(max-width:760px) {
  .story-carousel-group img {
    width: 70vw;
    height: 220px
  }
  .story-meaning {
    padding: 60px 0
  }
  .story-meaning h2 {
    font-size: 27px;
    padding-left: 20px;
    margin-bottom: 30px
  }
  .story-body {
    font-size: 16px;
    line-height: 1.9
  }
  .story-team {
    padding-top: 60px
  }
  .story-origin {
    padding: 60px 0 20px
  }
  .story-origin-grid {
    grid-template-columns: 1fr;
    gap: 35px
  }
  .story-helmet {
    width: 65%;
    max-width: 300px;
    margin: auto
  }
  .story-work-photo {
    width: 85%;
    max-width: 480px;
    margin-top: 35px
  }
}

@media(prefers-reduced-motion:reduce) {
  .story-carousel-track {
    animation: none
  }
}

.story-origin-grid {
  align-items: start
}

.story-origin-grid>.story-body {
  padding-top: 70px
}

.story-origin-visual {
  position: relative;
  width: 400px;
  height: 760px
}

.story-origin-visual .story-helmet {
  display: block;
  width: 400px;
  max-width: none;
  margin: 0
}

.story-origin-visual .story-work-photo {
  position: absolute;
  left: 360px;
  top: 460px;
  width: 480px;
  max-width: none;
  margin: 0
}

.story-team img,.story-origin-visual img {
  transition-delay: var(--story-reveal-delay,0ms)
}

@media(min-width:761px) and (max-width:1000px) {
  .story-origin-visual {
    width: 100%;
    height: 650px
  }
  .story-origin-visual .story-helmet {
    width: 100%
  }
  .story-origin-visual .story-work-photo {
    left: calc(100% - 40px);
    top: calc((100vw - 112px)*.35*1.25 - 40px);
    width: 120%
  }
}

@media(max-width:760px) {
  .story-origin-visual {
    width: 100%;
    height: calc((100vw - 44px)*1.0125 - 40px)
  }
  .story-origin-visual .story-helmet {
    width: 52%;
    max-width: none
  }
  .story-origin-visual .story-work-photo {
    left: calc(52% - 40px);
    top: calc((100vw - 44px)*.65 - 40px);
    width: 58%;
    max-width: none
  }
  .story-origin-grid>.story-body {
    padding-top: 0
  }
}

@media(prefers-reduced-motion:reduce) {
  .story-team img,.story-origin-visual img {
    transition-delay: 0ms
  }
}

@media(max-width:760px) {
  .story-origin-grid>.story-body {
    grid-row: 1
  }
  .story-origin-grid>.story-origin-visual {
    grid-row: 2
  }
}