@charset "UTF-8";
/* ---------------------------- */
/* Base
/* ---------------------------- */
:root {
  --main-color: #000;
  --font: "Puritan", 游ゴシック, "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", メイリオ, Meiryo "system-ui", sans-serif;
}

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: 150px;
  margin: 0;
  font-size: 62.5%;
  box-sizing: border-box;
}

/* 変更 */
main .l-inner {
  margin: 0 auto;
}

main .l-inner * {
  box-sizing: border-box;
}

main .l-inner article {
  width: 100%;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  margin: 0 calc(50% - 50vw);
  width: 100vw;
}

.ftool-wrapper {
  background-color: #fff;
}

.ftool-wrapper p {
  line-height: 1em;
}

.ftool-wrapper .col--02--C {
  width: auto;
}

/*fix*/
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger {
  opacity: 0;
}

.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeInAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeUp {
  -webkit-animation-name: fadeUpAnime;
  animation-name: fadeUpAnime;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.delay-time02 {
  animation-delay: 0.2s;
}

.delay-time04 {
  animation-delay: 0.4s;
}

.delay-time05 {
  animation-delay: 0.5s;
}

.delay-time06 {
  animation-delay: 0.6s;
}

.delay-time08 {
  animation-delay: 0.8s;
}

.delay-time1 {
  animation-delay: 1s;
}

.delay-time12 {
  animation-delay: 1.2s;
}

.delay-time15 {
  animation-delay: 1.5s;
}

.delay-time2 {
  animation-delay: 2s;
}

.delay-time25 {
  animation-delay: 2.5s;
}

.delay-time3 {
  animation-delay: 3s;
}

.delay-time35 {
  animation-delay: 3.5s;
}

.delay-time4 {
  animation-delay: 4s;
}

.delay-time45 {
  animation-delay: 4.5s;
}

.ftool-wrapper .ref-item .name {
  font-size: 12px;
}

.ftool-wrapper .col--02--C {
  width: auto;
}

/* フェードアウトのアニメーション */
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.box-wrapper .pc {
  display: none;
}
@media screen and (min-width: 750px) {
  .box-wrapper .pc {
    display: block;
  }
}
.box-wrapper .sp {
  display: block;
}
@media screen and (min-width: 750px) {
  .box-wrapper .sp {
    display: none;
  }
}

/* ---------------------------- */
/* Initialize
/* ---------------------------- */

.box-wrapper {
  font: normal 400 16px/1.75 "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  background: #fefefe;
  color: #000;
  position: relative;
  overflow-x: clip;
  display: flex;
  flex-direction: column;
}

.box-wrapper a:link,
.box-wrapper a:visited {
  color: #000;
  text-decoration: underline;
  transition: 0.3s ease;
}

.box-wrapper a:hover,
.box-wrapper a:active {
  color: #999;
  text-decoration: none;
}

@media screen and (min-width: 750px) {
  .box-wrapper {
    flex-direction: row;
  }
}

/* ---------------------------- */
/* Font
/* ---------------------------- */

.box-wrapper .-oswald {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.box-wrapper .-fw_100 {
  font-weight: 100;
}
.box-wrapper .-fw_200 {
  font-weight: 200;
}
.box-wrapper .-fw_300 {
  font-weight: 300;
}
.box-wrapper .-fw_400 {
  font-weight: 400;
}
.box-wrapper .-fw_500 {
  font-weight: 500;
}
.box-wrapper .-fw_600 {
  font-weight: 600;
}
.box-wrapper .-fw_700 {
  font-weight: 700;
}
.box-wrapper .-fw_800 {
  font-weight: 800;
}
.box-wrapper .-fw_900 {
  font-weight: 900;
}

/* ---------------------------- */
/* Image
/* ---------------------------- */

.box-wrapper img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  backface-visibility: hidden;
  image-rendering: -webkit-optimize-contrast;
}

.box-wrapper .-pic {
  display: block;
  width: 100%;
  padding: 0;
  box-sizing: border-box;
  position: relative;
}

.box-wrapper .-pic > .-img {
  display: block;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  padding-top: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

/* ---------------------------- */
/* Text
/* ---------------------------- */

.box-wrapper .-text_box > * {
  margin-bottom: 1.75em;
}
.box-wrapper .-text_box > *:last-child {
  margin-bottom: 0;
}

.box-wrapper .-ls_-200 {
  letter-spacing: -0.2em;
}
.box-wrapper .-ls_-175 {
  letter-spacing: -0.175em;
}
.box-wrapper .-ls_-150 {
  letter-spacing: -0.15em;
}
.box-wrapper .-ls_-125 {
  letter-spacing: -0.125em;
}
.box-wrapper .-ls_-100 {
  letter-spacing: -0.1em;
}
.box-wrapper .-ls_-75 {
  letter-spacing: -0.075em;
}
.box-wrapper .-ls_-50 {
  letter-spacing: -0.05em;
}
.box-wrapper .-ls_-25 {
  letter-spacing: -0.025em;
}
.box-wrapper .-ls_25 {
  letter-spacing: 0.025em;
}
.box-wrapper .-ls_50 {
  letter-spacing: 0.05em;
}
.box-wrapper .-ls_75 {
  letter-spacing: 0.075em;
}
.box-wrapper .-ls_100 {
  letter-spacing: 0.1em;
}
.box-wrapper .-ls_125 {
  letter-spacing: 0.125em;
}
.box-wrapper .-ls_150 {
  letter-spacing: 0.15em;
}
.box-wrapper .-ls_175 {
  letter-spacing: 0.175em;
}
.box-wrapper .-ls_200 {
  letter-spacing: 0.2em;
}

/* ---------------------------- */
/* Inner
/* ---------------------------- */

.box-wrapper * > .-inner {
  width: 92%;
  margin: 0 auto;
}

/* ---------------------------- */
/* KV
/* ---------------------------- */

.box-wrapper #--250723jw__kv {
  width: 100%;
  height: 540px;
  position: relative;
  background: #dbdfe0 url(../../assets/images/fv/sp.png) no-repeat bottom center / cover;
  z-index: 1;
}

.box-wrapper #--250723jw__kv::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.16) 8%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.24));
}

.box-wrapper #--250723jw__kv > .-inner {
  width: 100%;
  height: 100%;
  position: relative;
}

.box-wrapper .--250723jw__kv-title {
  width: 200px;
  position: absolute;
  bottom: 40px;
  left: 32px;
}

.box-wrapper .--250723jw__kv-logo {
  width: 166px;
  position: absolute;
  top: 24px;
  right: 24px;
}

@media screen and (min-width: 750px) {
  .box-wrapper #--250723jw__kv {
    width: 50%;
    height: 100dvh;
    position: fixed;
    top: 0;
    left: 0;
    background: #dbdfe0 url(../../assets/images/fv/pc.png) no-repeat center / cover;
  }

  .box-wrapper .--250723jw__kv-title {
    width: 296px;
    bottom: 64px;
    left: 56px;
  }

  .box-wrapper .--250723jw__kv-logo {
    top: 40px;
    right: 40px;
  }
}

/* ---------------------------- */
/* MAIN
/* ---------------------------- */

.box-wrapper #--250723jw__main {
  width: 100%;
  overflow-x: clip;
}

.box-wrapper #--250723jw__main > .-inner {
  width: 86%;
}

@media screen and (min-width: 750px) {
  .box-wrapper #--250723jw__main {
    width: 50%;
    margin: 0 0 0 auto;
  }

  .box-wrapper #--250723jw__main > .-inner {
    width: 75%;
  }
}

/* ---------------------------- */
/* LEAD
/* ---------------------------- */

.box-wrapper #--250723jw__lead {
  position: relative;
}

.box-wrapper #--250723jw__lead::before {
  display: block;
  content: "";
  width: 240px;
  height: 193px;
  background: url(../../assets/images/logo/jw_m_gy.svg) no-repeat center / cover;
  position: absolute;
  top: -16px;
  right: -88px;
}

.box-wrapper #--250723jw__lead > .-inner {
  width: 100%;
  padding: 56px 0 0;
  position: relative;
}

.box-wrapper .--250723jw__lead-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 0 56px;
}

.box-wrapper .--250723jw__lead-text > * {
  display: flex;
  flex-direction: column;
  font-size: 15px;
  line-height: 2.75;
}

.box-wrapper .--250723jw__lead-text .-period {
  margin: 0 0 0 0.15em;
}

.box-wrapper .--250723jw__lead-text .-quote {
  margin: 0 0.25em;
}

.box-wrapper .--250723jw__lead-scroll {
  display: none;
}

@media screen and (min-width: 750px) {
  .box-wrapper #--250723jw__lead::before {
    width: 400px;
    height: 321px;
    right: -120px;
  }

  .box-wrapper #--250723jw__lead > .-inner {
    padding-top: 144px;
  }

  .box-wrapper .--250723jw__lead-text {
    margin-bottom: 72px;
  }

  .box-wrapper .--250723jw__lead-text > * {
    font-size: 18px;
  }

  .box-wrapper .--250723jw__lead-scroll {
    display: block;
    margin: 0 0 96px;
  }

  .box-wrapper .--250723jw__lead-scroll > .-inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
  }

  .box-wrapper .--250723jw__lead-scroll-text {
    font-size: 12px;
    line-height: 1;
    position: relative;
    padding: 0 0 96px;
  }

  .box-wrapper .--250723jw__lead-scroll-line {
    width: 7px;
    height: 80px;
    position: absolute;
    top: 24px;
    left: 50%;
    transform: translate(-50%, 0);
  }

  .box-wrapper .--250723jw__lead-scroll-line::before {
    display: block;
    content: "";
    width: 1px;
    height: 80px;
    background: #000;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
  }

  .box-wrapper .--250723jw__lead-scroll-line::after {
    display: block;
    content: "";
    width: 7px;
    height: 7px;
    background: #000;
    border-radius: 50%;
    margin-top: 4px;
    position: relative;
    animation: 2s scroll infinite;
  }

  @keyframes scroll {
    0% {
      opacity: 0;
      top: 0%;
    }

    50% {
      opacity: 1;
    }

    100% {
      opacity: 0;
      top: calc(100% - 16px);
    }
  }
}

/* ---------------------------- */
/* SNAPS
/* ---------------------------- */

.box-wrapper #--250723jw__snaps {
  display: flex;
  flex-direction: column;
  row-gap: 56px;
}

@media screen and (min-width: 750px) {
  .box-wrapper #--250723jw__snaps {
    row-gap: 120px;
  }
}

/* ---------------------------- */
/* SNAP
/* ---------------------------- */

.box-wrapper .--250723jw__snap-hl {
  font-size: 32px;
  line-height: 1;
  margin-bottom: 20px;
}

.box-wrapper .--250723jw__snap-pics {
  display: flex;
  flex-direction: column;
  row-gap: 48px;
}

.box-wrapper .--250723jw__snap-pic {
  position: relative;
}

.box-wrapper .--250723jw__snap-pic-1 {
  width: 100%;
}

.box-wrapper .--250723jw__snap-pic-2 {
  width: 56%;
  margin: -24px 0 0;
}

.box-wrapper .--250723jw__snap-pic-2.-landscape {
  width: 85%;
}

.box-wrapper .--250723jw__snap-odd .--250723jw__snap-pic-2 {
  margin-right: auto;
}

.box-wrapper .--250723jw__snap-even .--250723jw__snap-pic-2 {
  margin-left: auto;
}

.box-wrapper .--250723jw__snap-pic-3 {
  width: 80%;
}

.box-wrapper .--250723jw__snap-odd .--250723jw__snap-pic-3 {
  margin: 0 0 0 auto;
}

.box-wrapper .--250723jw__snap-even .--250723jw__snap-pic-3 {
  margin: 0 auto 0 0;
}

.box-wrapper .--250723jw__snap-pic > .-inner {
  width: 100%;
  position: relative;
  display: block;
}

.box-wrapper .--250723jw__snap-pic > .-inner::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: solid #000;
  z-index: 1;
}

.box-wrapper .--250723jw__snap-pic-1 > .-inner::before {
  border-width: 7px;
}

.box-wrapper .--250723jw__snap-pic-2 > .-inner::before {
  border-width: 5px;
}

.box-wrapper .--250723jw__snap-pic-3 > .-inner::before {
  border-width: 6px;
}

.box-wrapper .--250723jw__snap-pic img {
  width: 100%;
}

.box-wrapper .--250723jw__snap-pic-staff {
  font-size: 12px;
  line-height: 60px;
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.box-wrapper .--250723jw__snap-pic-credit {
  font-size: 12px;
  line-height: 60px;
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.box-wrapper .--250723jw__snap-pic-credit-btn {
  padding: 0 0 0 4px;
}

.box-wrapper .--250723jw__snap-pic-credit-btn a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 24px;
  line-height: 24px;
  background: #000;
  color: #fefefe;
}

.box-wrapper .--250723jw__snap-pic-credit-btn a:link,
.box-wrapper .--250723jw__snap-pic-credit-btn a:visited {
  text-decoration: none;
}

.box-wrapper .--250723jw__snap-pic-credit-btn a:hover {
  background: #999;
}

.box-wrapper .--250723jw__snap-pic-credit-btn a > span {
  margin-top: -1px;
}

@media screen and (min-width: 750px) {
  .box-wrapper .--250723jw__snap-hl {
    font-size: 40px;
  }

  .box-wrapper .--250723jw__snap-pics {
    row-gap: 80px;
  }

  .box-wrapper .--250723jw__snap-pic-1 > .-inner::before {
    border-width: 10px;
  }

  .box-wrapper .--250723jw__snap-pic-2 > .-inner::before {
    border-width: 6px;
  }

  .box-wrapper .--250723jw__snap-pic-3 > .-inner::before {
    border-width: 8px;
  }

  .box-wrapper .--250723jw__snap-pic-staff {
    font-size: 14px;
  }

  .box-wrapper .--250723jw__snap-pic-credit {
    font-size: 14px;
  }
}

/* ---------------------------- */
/* FOOTER
/* ---------------------------- */

.box-wrapper #--250723jw__footer {
  width: 100%;
  height: 50dvh;
}

.box-wrapper #--250723jw__footer > .-inner {
  width: 75%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.box-wrapper .--250723jw__footer-logo a {
  display: block;
  width: 80px;
  opacity: 1;
  transition: 0.3s ease;
}

.box-wrapper .--250723jw__footer-logo a:hover,
.box-wrapper .--250723jw__footer-logo a:active {
  opacity: 0.6;
}

@media screen and (min-width: 750px) {
  .box-wrapper #--250723jw__footer {
    height: 100dvh;
  }

  .box-wrapper .--250723jw__footer-logo a {
    width: 160px;
  }
}