@charset "utf-8";

@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap");

:root {
  --color: #462914;
  --color01: #f4eedb;
  --color02: #ff5618;
  --color03: #444;
  --color04: #3f69aa;
  --color05: #f8f7e4;
  --color06: #79431d;
  --fontZK: "Zen Kaku Gothic New", sans-serif;
}

#body_nenga2026 {
  background-image: url("/wp-content/themes/fuji/newyear/images/bg.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  box-sizing: border-box;
  color: var(--color);
  font-family: var(--fontZK);
  margin: 0;
}

#body_nenga2026 img {
  height: auto;
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  width: 100%;
}

.newyear-inner p,
.newyear-inner h2,
.newyear-inner h3 {
  font-family: var(--fontZK);
  margin-top: 0;
  margin-bottom: 0;
}

.newyear-contents {
  margin-left: auto;
  margin-right: auto;
  max-width: 1366px;
  padding-right: 20px;
  padding-left: 20px;
}

.newyear-inner {
  display: flex;
  justify-content: space-between;
}

.newyear-main {
  max-width: 580px;
  min-width: 375px;
  position: relative;
  width: 42.459%;
}

/* newyear-lead */
.newyear-lead {
  margin-top: 3.965%;
  padding-top: 3.448%;
  position: relative;
}

.newyear-lead__title {
  left: 5.517%;
  top: 0;
  position: absolute;
  width: 6.4%;
}

.newyear-lead__inner {
  margin-left: auto;
  margin-right: auto;
  width: 69.827%;
}

.newyear-lead__text {
  font-family: var(--fontZK);
  font-size: clamp(13px, 1.46vw, 20px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.08em;
  text-align: center;
}

.newyear-lead .newyear-lead__text:not(:first-child) {
  margin-top: 1em;
}

/* newyear-about */
.newyear-about {
  background-color: var(--color01);
  box-sizing: border-box;
  margin-top: 4.266%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4.58%;
  padding-left: 8.778%;
  padding-right: 8.778%;
  padding-bottom: 4.58%;
  width: 69.827%;
}

.newyear-about__title {
  font-family: var(--fontZK);
  font-size: clamp(14px, 1.53vw, 21px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-align: center;
}

.newyear-about .newyear-about__text {
  font-family: var(--fontZK);
  font-size: clamp(11px, 1.24vw, 17px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.08em;
  margin-top: 0.5em;
}

/* newyear-detail */
.newyear-detail {
  background-image: url("/wp-content/themes/fuji/newyear/images/detail_bg.webp");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin-top: 10.666%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4.8%;
  padding-bottom: 14.666%;
  width: 89.6%;
}

.newyear-detail__inner {
  margin-left: auto;
  margin-right: auto;
  width: 86.309%;
}

.newyear-detail__title {
  font-family: var(--fontZK);
  font-size: clamp(15px, 1.68vw, 23px);
  font-weight: 700;
  line-height: 1.66;
  letter-spacing: 0.08em;
  text-align: center;
}

.newyear-detail__items {
  margin-top: 2.976%;
}

.newyear-detail__item {
  display: flex;
}

.newyear-detail__item__row {
  display: flex;
}

.newyear-detail__03,
.newyear-detail__item__column {
  width: 50%;
}

.newyear-detail__slider {
  position: relative;
}

.newyear-detail__slider .swiper {
  margin-top: 3.571%;
  padding-bottom: 5.517%;
}

.newyear-detail__slider .swiper-slide {
  background-color: #fff;
  box-sizing: border-box;
  height: auto;
  padding-top: 3.571%;
  padding-left: 5.952%;
  padding-right: 5.952%;
  padding-bottom: 3.571%;
}

.newyear-detail__slider .swiper-slide__inner {
  height: 100%;
}

.newyear-detail__slider .swiper-button-next,
.newyear-detail__slider .swiper-button-prev {
  color: var(--color);
  height: 18.333%;
  width: 3.793%;
}

.newyear-detail__slider .swiper-button-next {
  left: auto;
  right: -7.586%;
}

.newyear-detail__slider .swiper-button-prev {
  left: -7.586%;
}

.newyear-detail__slider .swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 0;
}

.newyear-detail__slider .swiper-pagination-bullet {
  background-color: #999999;
  opacity: 1;
  height: auto;
  padding-top: 2.413%;
  width: 2.413%;
}

.newyear-detail__slider .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--color02);
}

.newyear-detail__subtitle {
  font-family: var(--fontZK);
  color: var(--color02);
  font-size: clamp(14px, 1.53vw, 21px);
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.1em;
}

.newyear-detail__text {
  font-family: var(--fontZK);
  font-size: clamp(12px, 1.31vw, 18px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

/* newyear-designs */
.newyear-designs {
  margin-top: 6.133%;
  position: relative;
}

.newyear-designs__text {
  font-family: var(--fontZK);
  font-size: clamp(13px, 1.46vw, 20px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.08em;
  margin-left: auto;
  margin-right: auto;
  width: 89.333%;
}

.newyear-design__wrap {
  position: relative;
}

.newyear-designs::before,
.newyear-design__wrap::before,
.newyear-design__wrap::after {
  background-image: url(/wp-content/themes/fuji/newyear/images/deco_01.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  content: "";
  padding-top: 71.466%;
  position: absolute;
  width: 23.466%;
}

.newyear-designs::before {
  top: 16%;
  left: 0;
}

.newyear-design__wrap::before {
  top: 48.086%;
  right: 0;
  transform: rotate(180deg);
}

.newyear-design__wrap::after {
  bottom: 3.767%;
  left: 0;
}

.newyear-designs__text.newyear-designs__text__01 {
  width: 64%;
}

.newyear-designs__text.newyear-designs__text__02 {
  margin-top: 10.933%;
}

.newyear-designs__text.newyear-designs__text__03 {
  margin-top: 2.666%;
}

.newyear-design {
  margin-top: 9.6%;
  margin-left: auto;
  margin-right: auto;
  width: 64%;
}

.newyear-design:first-child {
  margin-top: 3.733%;
}

.newyear-designs__title {
  font-family: var(--fontZK);
  font-size: clamp(17px, 1.9vw, 26px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-align: center;
}

.newyear-design__cap {
  margin-top: 4.166%;
}

.newyear-design__cap__title {
  border-bottom: 0.06em solid var(--color);
  font-family: var(--fontZK);
  font-size: clamp(15px, 1.68vw, 23px);
  font-weight: 700;
  line-height: 1.66;
  letter-spacing: 0.08em;
  margin-left: auto;
  margin-right: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.newyear-designs .newyear-design__cap__text {
  font-family: var(--fontZK);
  font-size: clamp(12px, 1.31vw, 18px);
  font-weight: 400;
  line-height: 1.58;
  letter-spacing: 0.08em;
  margin-top: 2.083%;
}

.newyear-designs .newyear-designs__comment {
  margin-top: 5.866%;
  margin-left: auto;
  margin-right: auto;
  width: 77.333%;
}

.newyear-design:nth-of-type(4) .newyear-design__img,
.newyear-design:nth-of-type(5) .newyear-design__img {
  margin-left: auto;
  margin-right: auto;
  width: 67.5%;
}

/* newyear-purpose */
.newyear-purpose {
  margin-top: 17.066%;
  margin-left: auto;
  margin-right: auto;
  width: 89.333%;
}

.newyear-purpose__title {
  margin-left: auto;
  margin-right: auto;
  width: 52.238%;
}

.newyear-purpose .newyear-purpose__text {
  color: var(--color03);
  font-family: var(--fontZK);
  font-size: clamp(13px, 1.46vw, 20px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.08em;
  margin-top: 3.88%;
}

.newyear-purpose__img {
  margin-top: 4.179%;
}

.newyear-purpose__subtitle {
  position: relative;
}

.newyear-purpose__subtitle__child {
  position: absolute;
  top: 0;
  left: 0;
}

.newyear-purpose__subtitle__span {
  -webkit-clip-path: inset(0 100% 0 0);
  clip-path: inset(0 100% 0 0);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  transition-duration: 1.2s;
  transition-timing-function: ease-in-out;
  transition-property: -webkit-clip-path, -webkit-mask-size;
  transition-property: clip-path, mask-size;
  transition-property: clip-path, mask-size, -webkit-clip-path, -webkit-mask-size;
  z-index: 1;
}

.newyear-purpose__subtitle__span.active {
  -webkit-clip-path: inset(0% 0% 0% 0%);
  clip-path: inset(0% 0% 0% 0%);
  -webkit-mask-size: 110% 110%;
  mask-size: 110% 110%;
}

.newyear-purpose__01 {
  margin-top: 3.582%;
}

.newyear-purpose__01 .newyear-purpose__subtitle {
  margin-left: auto;
  margin-right: auto;
  width: 61.492%;
}

.newyear-purpose__02 {
  margin-top: 11.94%;
}

.newyear-purpose__02 .newyear-purpose__subtitle {
  margin-left: auto;
  margin-right: auto;
  width: 68.656%;
}

.newyear-purpose__02 .newyear-purpose__img {
  margin-left: auto;
  margin-right: auto;
  width: 81.791%;
}

.newyear-purpose__icons {
  display: flex;
  justify-content: space-between;
  margin-top: 3.283%;
}

.newyear-purpose__icon {
  width: 22.686%;
}

.newyear-purpose .newyear-purpose__icon__cap {
  color: var(--color04);
  font-family: var(--fontZK);
  font-size: clamp(11px, 1.24vw, 17px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0.05em;
  text-align: center;
  margin-top: 5.263%;
}

.newyear-purpose .newyear-purpose__solution {
  margin-top: 4.179%;
  margin-left: auto;
  margin-right: auto;
  width: 56.119%;
}

/* newyear-info */
.newyear-info {
  margin-top: 6.933%;
  margin-left: auto;
  margin-right: auto;
  width: 89.333%;
}

.newyear-info__tel {
  margin-top: 2.985%;
  width: 94.925%;
}

/* newyear-footer */
.newyear-footer {
  background-image: url(/wp-content/themes/fuji/newyear/images/footer-bg.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center bottom;
  margin-top: 18.133%;
  padding-top: 19%;
  padding-bottom: 2.933%;
}

.newyear-footer__logo {
  margin-left: auto;
  margin-right: auto;
  width: 53.333%;
}

.newyear-footer__btn {
  margin-top: 2.666%;
  margin-left: auto;
  margin-right: auto;
  width: 89.333%;
}

.newyear-footer .newyear-footer__copyright {
  color: var(--color04);
  font-family: var(--fontZK);
  font-size: clamp(10px, 1.02vw, 14px);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin-top: 5.333%;
  text-align: center;
}

.newyear-fadein {
  transform: translate3d(0, 10%, 0);
  opacity: 0;
  transition: all 1s ease;
}

.newyear-fadein.active {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* newyear-index */
.newyear-index {
  display: block;
  max-width: 276px;
  min-width: 180px;
  position: relative;
  width: 20.204%;
}

.newyear-index__items {
  margin-top: 100px;
  padding-bottom: 100px;
  position: -webkit-sticky;
  position: sticky;
  top: 53.385%;
}

.newyear-index .newyear-index__link {
  align-items: center;
  background-color: var(--color05);
  box-sizing: border-box;
  color: var(--color06);
  display: flex;
  font-family: var(--fontZK);
  font-size: clamp(11px, 1.2vw, 16px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  margin-top: 2px;
  padding-left: 1em;
  position: relative;
  transition: 0.2s;
  height: 2.58em;
  width: 100%;
}

.newyear-index__link::before,
.newyear-index__link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.2em;
  width: 1px;
  height: 0.69em;
  border-radius: 9999px;
  background-color: var(--color06);
  transform-origin: 50% calc(100% - 0.5px);
}

.newyear-index__link::before {
  transform: translateY(-50%) rotate(45deg);
}

.newyear-index__link::after {
  transform: translateY(-50%) rotate(-45deg);
}

.newyear-index .newyear-index__link:hover {
  background-color: var(--color02);
  color: #fff;
}

.newyear-index .newyear-index__link:hover::before,
.newyear-index .newyear-index__link:hover::after {
  background-color: #fff;
}

/* newyear-loading */
.newyear-loading {
  align-items: center;
  display: flex;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  opacity: 1;
  transition: opacity 0.5s;
  width: 100%;
  z-index: 9999;
}

.newyear-loading__inner {
  background-color: #fff;
  max-width: 580px;
  min-width: 375px;
  position: relative;
  height: 100%;
  width: 42.459%;
}

.newyear-loading.hide {
  opacity: 0;
  pointer-events: none;
}

.newyear-loading__img {
  width: 51.153%;
}

.newyear-loading__bg,
.newyear-loading__frame,
.newyear-loading__text {
  opacity: 0;
  transition: opacity 0.6s ease;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.newyear-loading__bg.is-show,
.newyear-loading__frame.is-show,
.newyear-loading__text.is-show {
  opacity: 1;
}

.newyear-loading__bg {
  height: 100%;
  width: 100%;
  z-index: 1;
}

.newyear-loading__bg img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.newyear-loading__frame {
  width: 70.4%;
  z-index: 2;
}

.newyear-loading__text {
  width: 31.2%;
  z-index: 3;
}

/* newyear-left */
.newyear-left {
  display: block;
  max-width: 276px;
  min-width: 180px;
  width: 20.204%;
}

/*----------------------------------
  sp
----------------------------------*/
@media not all and (min-width: 768px) {
  #body_nenga2026 {
    background-image: none;
  }

  .newyear-contents {
    padding-right: 0;
    padding-left: 0;
  }

  .newyear-inner {
    display: block;
  }

  .newyear-main {
    max-width: none;
    min-width: auto;
    width: 100%;
  }

  .newyear-main::before {
    background-image: url("/wp-content/themes/fuji/newyear/images/bg_sp.webp");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center top;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
  }

  .newyear-lead__text {
    font-size: clamp(13px, 3.46vw, 26px);
  }

  .newyear-about__title {
    font-size: clamp(14px, 3.73vw, 28px);
  }

  .newyear-about__text {
    font-size: clamp(11px, 2.93vw, 22px);
  }

  .newyear-detail__title {
    font-size: clamp(15px, 4vw, 30px);
  }

  .newyear-detail__subtitle {
    font-size: clamp(14px, 3.73vw, 28px);
  }

  .newyear-detail__text {
    font-size: clamp(12px, 3.2vw, 24px);
  }

  .newyear-designs__title {
    font-size: clamp(17px, 4.53vw, 34px);
  }

  .newyear-designs__text {
    font-size: clamp(13px, 3.46vw, 26px);
  }

  .newyear-design__cap__title {
    font-size: clamp(15px, 4vw, 30px);
  }

  .newyear-design__cap__text {
    font-size: clamp(12px, 3.2vw, 24px);
  }

  .newyear-purpose__text {
    font-size: clamp(13px, 3.46vw, 26px);
  }

  .newyear-footer .newyear-footer__copyright {
    font-size: clamp(10px, 2.66vw, 20px);
  }

  .newyear-index,
  .newyear-left {
    display: none;
  }

  .newyear-loading__inner {
    max-width: none;
    min-width: auto;
    width: 100%;
  }
}
