@charset 'utf-8';

/**
 * common
 */
.header__logo {
  top: 52px;
}
.is-nav-active .header__logo {
  transition: opacity 0.2s 0.25s !important;
  opacity: 0 !important;
}
.header__lang-switcher {
  transition: opacity 0.2s 0.25s;
}
.is-nav-active .header__lang-switcher {
  opacity: 0;
}
.key__visual {
  margin-top: 115px;
}
@media screen and (max-width: 768px) {
  .header__logo {
    top: 50px;
  }
}

/**
 * top Animation
 */
.page-home.is-hidden .header__logo {
  opacity: 0;
  visibility: hidden;
}
.page-home.is-hidden .intro {
  opacity: 1;
  visibility: visible;
}
.page-home .header__logo {
  opacity: 1;
  visibility: visible;
  transition:
    opacity 1s,
    visibility 1s;
}
.page-home .header__logo.is-spmenu-hide {
  opacity: 0;
  visibility: hidden;
}
.page-home .intro {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 1s,
    visibility 1s;
}
.page-home.is-skip .intro .animate-logo {
  display: none;
}
.page-home.is-hidden .copyright p span {
  opacity: 0;
}
.page-home .copyright p span {
  transition: opacity 1.5s cubic-bezier(0.47, 0, 0.745, 0.715);
  opacity: 1;
}
.page-home .copyright p span.copyright-text01 {
  transition-delay: 0.8s;
}
.page-home .copyright p span.copyright-text02 {
  transition-delay: 2.3s;
}

/**
 * top
 */
.page-home .header__logo {
  display: block;
}
.page-home .intro {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: transparent url(../images/common/bg_main.png) center top;
  z-index: 100;
}
.page-home .copyright {
  width: 100%;
  height: 100svh;
  padding-top: 115px;
  display: block;
  position: relative;
}
.page-home .copyright-inner {
  width: 100%;
  height: 100%;
  padding: 0 min(calc(42 / 1560 * 100%), 42px) min(calc(30 / 1560 * 100vw), 30px);
  position: relative;
}
.page-home .copyright p {
  margin-left: min(calc(43 / 1560 * 100%), 43px);
  position: relative;
  z-index: 10;
  letter-spacing: 0.044em;
  color: #fff;
}
.page-home .copyright-movie {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.page-home .copyright-movie video {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
}
.page-home .copyright-movie button {
  width: clamp(98px, calc(156 / 1560 * 100vw), 156px);
  aspect-ratio: 156 / 198;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
  background: transparent;
  border: none;
  cursor: pointer;
}
.page-home .copyright-movie button::before {
  content: '';
  width: calc(101 / 156 * 100%);
  aspect-ratio: 1 / 1;
  display: block;
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 101 101"><path d="M50.5,101C22.654,101,0,78.346,0,50.5S22.654,0,50.5,0s50.5,22.655,50.5,50.5-22.655,50.5-50.5,50.5ZM50.5,3.708C24.699,3.708,3.708,24.699,3.708,50.5s20.991,46.792,46.792,46.792,46.793-20.991,46.793-46.792S76.301,3.708,50.5,3.708ZM40.405,74.307c-.32,0-.641-.071-.939-.217-.739-.359-1.209-1.109-1.209-1.931V28.841c0-.822.47-1.572,1.209-1.931.736-.36,1.618-.266,2.265.241l27.607,21.66c.518.407.822,1.03.822,1.69s-.304,1.283-.822,1.69l-27.607,21.659c-.386.302-.854.458-1.326.458ZM42.552,33.255v34.49l21.98-17.244-21.98-17.245Z" style="fill: %23fff;"/></svg>') no-repeat 0 0 / contain;
}
.page-home .copyright-modal {
  position: relative;
  z-index: 500;
}
.page-home .copyright-modal [data-micromodal-trigger],
.page-home .copyright-modal [data-micromodal-close] {
  cursor: pointer;
}
.page-home .copyright-modal [data-micromodal-close] :focus:not(:focus-visible) {
  outline: none;
}
.page-home .copyright-modal .micromodal-slide {
  transition: visibility 0.3s;
  display: block;
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='false'] {
  visibility: visible;
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='true'] {
  visibility: hidden;
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='false'] .modal__overlay {
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='false'] .modal__container {
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='true'] .modal__overlay {
  opacity: 1;
  animation: mmfadeOut 1.3s cubic-bezier(0, 0, 0.2, 1);
}
.page-home .copyright-modal .micromodal-slide[aria-hidden='true'] .modal__container {
  animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
@keyframes mmfadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mmfadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.page-home .copyright-modal .modal__container {
  max-width: 84%;
  margin: 0 auto;
  background: transparent;
  padding: 0;
  animation: none;
}
.page-home .copyright-modal .modal__content {
  margin: 0;
}
.page-home .copyright-modal .modal__content video {
  display: block;
  max-width: 100%;
  max-height: 90svh;
}
.page-home .section__01 .section-content {
  margin-top: 128px;
}
@media screen and (max-width: 768px) {
  .page-home .intro {
    background: transparent url(../images/common/sp/bg_main.png) center top;
    background-size: 117.1875vw 208.4375vw;
  }
  .page-home .copyright {
    padding-top: 96px;
  }
  .page-home .copyright-inner {
    padding: 0 15px 10px;
  }
  .page-home .copyright p {
    margin: 0 0 29px 0.04em;
    font-size: 2.2rem;
    line-height: calc(43 / 22 * 1em);
    letter-spacing: 0.02em;
  }
  .page-home .copyright-movie button {
    aspect-ratio: 98 / 114;
  }
  .page-home .section__01 .section-content {
    margin-top: 100px;
  }
}

/**
 * works 一覧
 */
.content.works .works-section__01 .section-content__text {
  margin-top: 28px;
  display: flex;
  justify-content: space-between;
}
.content.works .works-section__01 .works-section__01--menu .works-section__01--menuSpBtn {
  display: none;
}
.content.works .works-section__01 .section-content__text ul {
  margin-top: 22px;
  padding: 0;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: flex-start;
  row-gap: 34.5px;
  text-align: left;
}
.content.works .works-section__01 .section-content__text ul li {
  font-size: calc(18 / 16 * 1em);
}
.content.works .works-section__01 .section-content__text ul li a:hover,
.content.works .works-section__01 .section-content__text ul li.current-cat a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.5em;
  text-decoration-skip-ink: none;
}
.content.works .column-works {
  width: calc(900 / 1211.28 * 100%);
}
.content.works .column-works .works-lists-parts {
  width: 33.3333%;
  padding: 1.2rem;
}
.content.works .column-works .works-lists-parts img {
  height: auto;
  aspect-ratio: 1 / 1;
}
.content.works .works-section__01 .section-content__text p {
  margin: 6px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  font-size: calc(11 / 16 * 1em);
}
.content.works .works-section__01 .section-content__text p a {
  padding: 2px 10px 2px 8px;
  display: inline-block;
  background-color: #d6d6d6;
}
.content.works .column-works .works-lists-parts h3 {
  margin-right: auto;
  margin-left: auto;
  padding-top: 8px;
  font-size: 1em;
}
@media screen and (min-width: 1280px) {
  .content.works .works-section__01 .section-content {
    padding-left: calc(141 / 1556 * 100%);
    padding-right: calc(62 / 1556 * 100%);
  }
}
@media screen and (max-width: 768px) {
  .content.works .works-section__01 .section-content {
    padding-top: 0;
  }
  .content.works .works-section__01 .section-content__text {
    margin-top: 0;
    flex-direction: column;
  }
  .content.works .works-section__01 .works-section__01--menu {
    position: relative;
  }
  .content.works .works-section__01 .works-section__01--menu .works-section__01--menuSpBtn {
    padding: 0 20px;
    display: block;
  }
  .content.works .works-section__01 .works-section__01--menu .works-section__01--menuSpBtn button {
    width: 100%;
    padding: 13px 40px 13px 21px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    font-size: calc(13 / 16 * 1em);
    color: #000;
    text-align: left;
    background-color: transparent;
    border: 1px solid #3f3f3f;
    border-radius: 100vh;
  }
  .content.works .works-section__01 .works-section__01--menu .works-section__01--menuSpBtn button::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 17px;
    width: 13.5px;
    height: 9.5px;
    background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13.459 9.478"><polygon points="6.729 9.478 0 .376 .509 0 6.729 8.413 12.95 0 13.459 .376 6.729 9.478" style="fill: %23000;"/></svg>') no-repeat 50% 50% / contain;
    transform: translateY(-36%) rotate(0deg);
    opacity: 0.8;
    transition: transform 0.3s;
    will-change: transform;
    pointer-events: none;
  }
  .content.works .works-section__01 .works-section__01--menu ul {
    width: calc(100% - 40px);
    margin: 0;
    display: block;
    position: absolute;
    top: calc(100% + 10px);
    left: 20px;
    overflow: hidden;
    font-size: calc(13 / 16 * 1em);
    background-color: #fff;
    border: 1px solid #3f3f3f;
    border-radius: 6px;
    z-index: 10010;
    visibility: hidden;
    opacity: 0;
  }
  .content.works .works-section__01 .works-section__01--menu ul > li {
    padding: 0;
  }
  .content.works .works-section__01 .works-section__01--menu ul > li > a {
    width: 100%;
    display: block;
    padding: 10px 18px;
    text-align: left;
    text-decoration: none !important;
  }
  .content.works .works-section__01 .works-section__01--menu ul > li.current-cat > a {
    background-color: #fcfbf4;
  }
  .content.works .works-section__01 .works-section__01--menu ul > li:nth-child(n + 2) {
    border-top: 1px solid #3f3f3f;
  }
  .content.works .works-section__01 .works-section__01--menu .works-section__01--menuSpBg {
    width: 100%;
    height: 100%;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    background-color: transparent;
    border: none;
    z-index: 10000;
    visibility: hidden;
    opacity: 0;
  }
  .content.works .works-section__01 .works-section__01--menu.is-open ul,
  .content.works .works-section__01 .works-section__01--menu.is-open .works-section__01--menuSpBg {
    visibility: visible;
    opacity: 1;
  }
  .content.works .works-section__01 .works-section__01--menu.is-open .p-products__sort--spBtn button::after {
    transform: translateY(-36%) rotate(-180deg);
  }
  .content.works .column-works {
    width: calc(366 / 395 * 100%);
    margin: 16px auto 0;
  }
  .content.works .column-works .works-lists-parts {
    width: 50%;
    padding: 0.7rem;
  }
  .content.works .works-section__01 .section-content__text p {
    font-size: 1rem;
  }
  .content.works .column-works .works-lists-parts h3 {
    padding-top: 6px;
    font-size: calc(13 / 16 * 1em);
  }
}

/**
 * works 一覧 EN
 */
[lang='en-US'] .content.works .works-section__01--menu {
  display: none;
}
[lang='en-US'] .content.works .column-works {
  margin-right: auto;
  margin-left: auto;
}

/**
 * works 詳細
 */
.content.works .profile .section-other-works .other-works__list {
  display: flex;
}
@media screen and (max-width: 768px) {
  .content.works .profile .section-other-works .other-works__list {
    flex-direction: column;
    row-gap: 10px;
  }
  .content.works .profile .button.back {
    display: flex;
  }
  .content.works .profile .button.back:last-child {
    margin-bottom: 50px;
  }
}