/* 主視覺 */
@media only screen and (max-width: 500px) {
    .mobile__only{
      display: block !important;
      background-color: #f7f7f7;
      font-size: 2vh;
      width: 100%;
      height: 100%;
      margin: 0 auto;
      text-align: center;
      position: fixed;
      top: 0;
      left: 0;
      padding: 150px 0 0 0;
      z-index: 99999;
    }
    .mobile__only p{
      width: 100%;
      height: 100%;
      margin: auto auto;
    }
  }
  ::selection {
      color: #000;
      background: rgba(227, 255, 86, 0.99);
    }
    * {
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      box-shadow: none;
      outline: none;
    }
    a, a:visited {
      text-decoration: none;
      cursor: pointer;
      display: block;
      color: #000;
    }
    :hover {
      cursor: pointer;
    }
    .section {
      text-align: center;
      position: relative;
      margin-top: 100px;
    }
    ul, li {
      list-style: none;
    }
    #mouseimg {
      position: fixed;
      width: 20px;
    }
  body {
    background: #f7f7f7;
    font-family: "Noto Sans TC", sans-serif;
    font-family: "Oswald", sans-serif;
    font-size: 14px;
    color: #000;
    margin: 0;
    padding: 0;  
  }
  body::-webkit-scrollbar {
    display: none;
  }
    .scroll {
      width: auto;
      height: auto;
      position: absolute;
      bottom: 3rem;
      left: 9rem;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    .scroll p {
      margin-top: 10px;
      font-family: "Oswald", sans-serif;
      font-size: 1rem;
      letter-spacing: 5px;
      text-indent: 12px;
      color: #000;
    }
    
    
    @-webkit-keyframes trackBallSlide {
      0% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      6% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      14% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      15%,
      19% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      28%,
      29.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      30% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      36% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      44% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      45%,
      49% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      58%,
      59.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      60% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      66% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      74% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      75%,
      79% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      88%,
      100% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
    }
    @keyframes trackBallSlide {
      0% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      6% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      14% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      15%,
      19% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      28%,
      29.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      30% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      36% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      44% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      45%,
      49% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      58%,
      59.99% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      60% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
      66% {
        opacity: 1;
        transform: scale(0.9) translateY(5px);
      }
      74% {
        opacity: 0;
        transform: scale(0.4) translateY(40px);
      }
      75%,
      79% {
        opacity: 0;
        transform: scale(0.4) translateY(-20px);
      }
      88%,
      100% {
        opacity: 1;
        transform: scale(1) translateY(-20px);
      }
    }
    @-webkit-keyframes nudgeMouse {
      0% {
        transform: translateY(0);
      }
      20% {
        transform: translateY(8px);
      }
      30% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(8px);
      }
      60% {
        transform: translateY(0);
      }
      80% {
        transform: translateY(8px);
      }
      90% {
        transform: translateY(0);
      }
    }
    @keyframes nudgeMouse {
      0% {
        transform: translateY(0);
      }
      20% {
        transform: translateY(8px);
      }
      30% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(8px);
      }
      60% {
        transform: translateY(0);
      }
      80% {
        transform: translateY(8px);
      }
      90% {
        transform: translateY(0);
      }
    }
    @-webkit-keyframes nudgeText {
      0% {
        transform: translateY(0);
      }
      20% {
        transform: translateY(2px);
      }
      30% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(2px);
      }
      60% {
        transform: translateY(0);
      }
      80% {
        transform: translateY(2px);
      }
      90% {
        transform: translateY(0);
      }
    }
    @keyframes nudgeText {
      0% {
        transform: translateY(0);
      }
      20% {
        transform: translateY(2px);
      }
      30% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(2px);
      }
      60% {
        transform: translateY(0);
      }
      80% {
        transform: translateY(2px);
      }
      90% {
        transform: translateY(0);
      }
    }
    .pc__nav {
      width: auto;
      height: auto;
      font-size: 13px;
      font-family: "Oswald", sans-serif;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      background-color: transparent;
      display: flex;
      align-items: center;
      justify-content: start;
      margin: 0 0 0 40px;
      position: fixed;
      left: 0;
      top: 120px;
      overflow: hidden;
      z-index: 9;
    }
    .pc__nav ul.pc__menu {
      background-color: transparent;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: start;
      padding: 0;
    }
    .pc__nav ul.pc__menu li {
      width: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin-bottom:24px;
      transform: 0.2s;
    }
    .pc__nav ul.pc__menu li:hover {  
      background: rgba(227, 255, 86, 0.99);
      transform: 0.2s;
    }
    .lightbox {
      /* Default to hidden */
      display: none;
    
      /* Overlay entire screen */
      position: fixed;
      z-index: 99999;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
    
      /* A bit of padding around image */
      padding: 1em;
    
      /* Translucent background */
      background: rgba(0, 0, 0, 0.8);
      transition: 1s;
    }
    
    /* Unhide the lightbox when it's the target */
    .lightbox:target {
      display: block;
      transition: 1s;
    }
    
    .lightbox span {
      /* Full width and height */
      display: block;
      width: 100%;
      height: 100%;
    
      /* Size and position background image */
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      position: relative;
      z-index: 9999;
    }
    
    .scroll-button {
      position: absolute;
      width: 100%;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      -ms-flex-align: center;
      align-items: center;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }
    .scroll-button__inner {
      width: 300px;
      position: absolute;
      z-index: 999;
      cursor: pointer;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      -ms-flex-align: center;
      align-items: center;
      bottom: 0 !important;
      left: calc(50% - 150px);
      font-family: "Noto Sans TC", sans-serif;
      font-family: "Oswald", sans-serif;
    }
    .scroll-button__title {
      font-family: "Noto Sans TC", sans-serif;
      font-family: "Oswald", sans-serif;
      font-size: 1rem;
      letter-spacing: 0.2em;
      color: #fff;
      display: block;
      margin-bottom: 10px;
    }
    .scroll-button__lower {
      height: 180px;
      position: relative;
      width: 100%;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center;
      -ms-flex-pack: center;
      justify-content: center;
    }
    .scroll-button__label__left {
      color: #fff;
      font-size: 2rem;
      letter-spacing: 1rem;
      padding-left: 1rem;
      transition: 1s;
      display: block;
    }
    .scroll-button__label__right {
      color: #fff;
      font-size: 2rem;
      letter-spacing: 1rem;
      padding-left: 1rem;
      transition: 1s;
      display: block;
    }
    
    .scroll-button__lower:hover .scroll-button__label__left {
      letter-spacing: 3rem;
      padding-left: 3rem;
      transition: 1s;
    }
    .scroll-button__lower:hover .scroll-button__label__right {
      letter-spacing: 3rem;
      padding-left: 5rem;
      transition: 1s;
    }
    .scroll-button__line {
      position: absolute;
      width: 1px;
      background: #fff;
      left: 50%;
      height: 90%;
      bottom: 0;
      -webkit-animation: alinear 1s linear infinite;
      animation: alinear 1s linear infinite;
    }
    @-webkit-keyframes alinear {
      0% {
        opacity: 1;
        height: 90%;
      }
      50% {
        opacity: 0;
        height: 100%;
      }
      100% {
        opacity: 1;
        height: 90%;
      }
    }
    
    /* ====== head ====== */
    .is-open .head {
      z-index: 100;
      filter: unset;
      mix-blend-mode: unset;
    }
    .head {
      width: 100%;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 100;
    }
    .head__inner {
      padding: 36px 40px 28px 48px;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: space-between;
      align-items: center;
    }
    .head__info {
      margin-right: 106px;
    }
    .head__info p {
      font-family: var(--en-font);
      font-size: 10px;
      letter-spacing: .2em;
      text-align: right;
    }
    .head__info p span {
      display: block;
      margin-bottom: 4px;
    }
    .logo {
      position: relative;
      opacity: 1;
      display: block;
      width: 200px;
      height: auto;
      object-fit: contain;
      fill: #000;
    }
    
    /* ====== menu ====== */
    body.is-open {
      height: 100%;
      overflow: hidden;
    }
    .menu {
      display: block;
      position: fixed;
      top: 40px;
      right: 40px;
      width: 82px;
      height: 33px;
      cursor: pointer;
      z-index: 101;
    }
    #hamburger {
      position: absolute;
      height: 100%;
      width: 100%;
      -webkit-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
    }
    #hamburger span {
      display: block;
      position: relative;
      width: 100%;
      height: 1px;
      background: #000;
      -webkit-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
    }
    #hamburger span::before {
      position: absolute;
      content: '';
      background: #D9D9D9;
      width: 1px;
      height: 10px;
      left: 0;
      top: 0;
      -webkit-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
      transform-origin: top left;
      transition-delay: .3s;
    }
    #hamburger span:nth-of-type(1)::after {
      position: absolute;
      content: '';
      background: #D9D9D9;
      opacity: .8;
      width: 1px;
      height: 32px;
      right: 0;
      top: 0;
      transform-origin: top right;
      transition-delay: .6s;
    }
    #hamburger span:nth-of-type(1) {
    top: 0;
      transform-origin: top left;
      transition-delay: .4s;
    }
    #hamburger span:nth-of-type(2) {
    top: 10px;
      transform-origin: top left;
      transition-delay: .65s;
    }
    #hamburger span:nth-of-type(3) {
    top: 20px;
      transform-origin: top left;
      transition-delay: .85s;
    }
    .is-open #hamburger span:before {
      height: 0;
      transform-origin: bottom left;
    }
    .is-open #hamburger span:nth-of-type(1) {
      width: 0;
      transition-delay: .2s;
    }
    .is-open #hamburger span:nth-of-type(2) {
      width: 0;
      transition-delay: .2s;
    }
    .is-open #hamburger span:nth-of-type(3) {
      width: 0;
      transition-delay: .2s;
    }
    .is-open #hamburger span:nth-of-type(1)::after {
      height: 0;
      transition-delay: .2s;
    }
    .is-open #cross {
      -webkit-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
    }
    #cross {
      position: relative;
      right: 0;
      top: 0;
      width: 100%;
      height: 100%;
    }
    #cross span {
      position: absolute;
      width: 0;
      transform-origin: left;
    }
    #cross span:nth-of-type(1) {
      transform: rotate(157deg);
      top: 0;
      left: 76px;
    }
    #cross span:nth-of-type(2) {
      transform: rotate(22deg);
      top: 0;
      left: 0;
    }
    .is-open #cross span {
      display: block;
      position: relative;
      width: 100%;
      height: 1px;
      background: #fff;
      -webkit-transition: .35s ease-in-out;
      -o-transition: .35s ease-in-out;
      transition: .35s ease-in-out;
    }
    .is-open #cross span:nth-of-type(1) {
      width: 100%;
      transition-delay: .6s;
    }
    .is-open #cross span:nth-of-type(2) {
      width: 100%;
      transition-delay: .5s; 
    }
    .is-open #navigation {
      opacity: 1;
      visibility: visible;
      z-index: 99;
      transition: opacity .4s linear;
      -webkit-transition: opacity .4s linear;
      -o-transition: opacity .4s linear;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
    }
    
    #navigation {
      opacity: 0;
      visibility: hidden;
      width: 100%;
      height: 100vh;
      padding: 0 40px 0;
      position: fixed;
      top: 0;
      left: 0;
      z-index: -10;
      background: #000;
      color: #fff;
      justify-content: space-around;
      transition: opacity .4s linear;
      -webkit-transition: opacity .4s linear;
      -o-transition: opacity .4s linear;
      display: grid;
      align-content: center;
    }
    .nav__info {
      grid-row: 1/2;
      grid-column: 1/2;
    }
    .nav__news {
      grid-row: 2/2;
      grid-column: 1/2;
    }
    .nav__content {
      grid-row: 1/span 2;
      grid-column: 2/3;
      margin-left: -30px;
    }
    .nav__logo {
      margin-bottom: 32px;
    }
    .nav__logo a {
      margin-bottom: 14px;
    }
    .nav__logo a img {
      max-width: 168px;
    }
    .nav__logo .ja {
      font-size: 12px;
      letter-spacing: .2em;
      color: #fff;
    }
    .nav__info__content p,
    .nav__fax span {
      font-size: 12px;
      letter-spacing: .2em;
      margin-bottom: 10px;
      color: #fff;
    }
    .nav__address {
      line-height: 2;
    }
    .nav__address span {
      display: block;
    }
    .nav__tel a {
      color: #fff;
    }
    .nav__fax span {
      display: inline-block;
    }
    .nav__url a {
      display: inline-block;
      color: #fff;
    }
    .nav__sns {
      margin-top: 28px;
      margin-bottom: 28px;
    }
    .nav__sns .sns__list {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      align-items: center;
    }
    .nav__sns .sns__item {
      margin-right: 14px;
    }
    .nav__sns .sns__item a {
      max-width: 14.5px;
      color: #fff;
    }
    .nav__news__item a,
    .nav__button a {
      color: #fff;
    }
    .nav__news__item {
      font-size: 12px;
      line-height: 28px;
      margin-bottom: 14px;
      letter-spacing: .2em;
    }
    .nav__news__item a .nav__news__date {
      margin-right: 32px;
    }
    .nav__button {
      font-size: 16px;
      font-family: var(--en-font);
      letter-spacing: 0.05em;
      width: fit-content;
      padding-bottom: 4px;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      align-items: center;
      border-bottom: 2px solid #fff;
    }
    .nav__button::after {
      content: '';
      background: url(../img/arrow_white.svg) center no-repeat;
      background-size: contain;
      display: inline-block;
      margin-top: 0;
      margin-left: 8px;
      width: 20px;
      height: 6px;
    }
    .nav__item {
      font-size: 28px;
      font-family: var(--en-font);
      font-weight: 600;
      letter-spacing: 0.15em;
      margin-bottom: 32px;
    }
    .nav__item:nth-of-type(5) {
      opacity: .3;
    }
    .nav__item a {
      color: #fff;
    }
    .nav__link a:nth-of-type(1) {
      margin-bottom: 14px;
    }
    .nav__link a {
      color: #fff;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      align-items: center;
      font-size: 10px;
      letter-spacing: 0.08em;
    }
    .nav__link a::before {
      content: '';
      width: 5px;
      height: 5px;
      margin-right: 6px;
      border-top: 1px solid #fff;
      border-right: 1px solid #fff;
      transform: rotate(45deg);
    }
    /* グロナビのカレント表示 */
    .nav__list li a,
    .nav__list li a.nav-current {
        position: relative;
        width: fit-content;
    }
    .nav__list li a::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -13px;
        width: 100%;
        height: 2px;
        background: #fff;
        transition: all .4s;
        transform: scale(0, 1);
        transform-origin: left bottom;
    }
    .nav__list li a:hover::after,
    .nav__list li a.nav-current::after {
        transform: scale(1, 1);
    }
    
    
    /* ====== SNS ====== */
    .sns {
      position: fixed;
      right: 40px;
      top: 120px;
      width: 15px;
      z-index: 8;
    }
    .sns .sns__item {
      margin-bottom: 24px;
    }
    .sns .copyright {
      font-family: var(--en-font);
      font-size: 10px;
      writing-mode: vertical-rl;
      letter-spacing: .1em;
      position: fixed;
      right: 39px;
      bottom: 48px;
      z-index: 10;
    }
    
    #swiper__sec01.swiper {
      width: calc(100vw - 15rem);
      height: calc(100vh - 10rem);
      position: relative !important;
      z-index: 1 !important;
    }
    
    #swiper__sec01 .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: flex !important;
      justify-content: center;
      align-items: center;
    }
    
    #swiper__sec01 .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .swiper-slide-active img {
      -webkit-animation: zoomIn-data-v-b9764f4c 3s linear;
      animation: zoomIn-data-v-b9764f4c 3s linear;
    }
    @-webkit-keyframes zoomIn-data-v-b9764f4c {
      0% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
      }
      to {
        -webkit-transform: scale(1);
        transform: scale(1);
      }
    }
    @keyframes zoomIn-data-v-b9764f4c {
      0% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
      }
      to {
        -webkit-transform: scale(1);
        transform: scale(1);
      }
    }
    
    .autoplay-progress {
      position: absolute;
      left: 16px;
      top: 16px;
      z-index: 10;
      width: 48px;
      height: 48px;
      font-size: 21px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: #fff;
      mix-blend-mode: difference;
    }
    .autoplay-progress svg {
      --progress: 0;
      position: absolute;
      left: 0;
      top: 0px;
      z-index: 10;
      width: 100%;
      height: 100%;
      stroke-width: 4px;
      stroke: #fff;
      fill: none;
      stroke-dashoffset: calc(125.6 * (1 - var(--progress)));
      stroke-dasharray: 125.6;
      transform: rotate(-90deg);
      mix-blend-mode: difference;
    }
    .swiper-pagination {
      position: absolute;
      text-align: center;
      left: calc(0% + 80px) !important;
      top: 30px !important;
      width: auto !important;
      transition: 0.3s opacity;
      transform: translate3d(0, 0, 0);
      z-index: 10;
      mix-blend-mode: difference;
    }
    .swiper-pagination .swiper-pagination-bullet {
      background-color: #fff;
    }
    
    .ticker[data-v-b97123a0] {
      width: 100%;
      height: 200px;
      position: absolute;
      bottom: 0% !important;
      left: 0;
      margin: 0;
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
      box-sizing: border-box;
      mix-blend-mode: difference;
      z-index: 100;
      overflow: hidden;
    }
    
    .ticker .ttl-move[data-v-b97123a0] {
      font-size: 12.857rem;
      font-weight: 600;
      line-height: 1;
      position: absolute;
      letter-spacing: 30px;
      white-space: nowrap;
      /* overflow: hidden; */
      -webkit-animation: ticker-data-v-b97123a0 100s linear 2s infinite;
      animation: ticker-data-v-b97123a0 100s linear 2s infinite;
      display: inline-block;
      vertical-align: top;
      color: #ffffff;
      font-family: gill-sans-nova, sans-serif;
    }
    
    .ticker.move[data-v-b97123a0] {
      -webkit-animation-name: txt-data-v-b97123a0;
      animation-name: txt-data-v-b97123a0;
      -webkit-animation-duration: 0.6s;
      animation-duration: 0.6s;
      -webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1);
      animation-timing-function: cubic-bezier(1, 0, 0, 1);
      -webkit-animation-delay: 2s;
      animation-delay: 2s;
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-direction: normal;
      animation-direction: normal;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
    }
    
    .is-ie .ticker .ttl-move[data-v-b97123a0] {
      color: #3c3c3c;
    }
    
    @-webkit-keyframes txt-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(110%);
        transform: translateX(110%);
      }
    
      to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    }
    
    @keyframes txt-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(110%);
        transform: translateX(110%);
      }
    
      to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    }
    
    @-webkit-keyframes txtSp-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(110%);
        transform: translateX(110%);
      }
    
      to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    }
    
    @keyframes txtSp-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(110%);
        transform: translateX(110%);
      }
    
      to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    }
    
    @-webkit-keyframes ticker-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    
      to {
        -webkit-transform: translateX(-80%);
        transform: translateX(-80%);
      }
    }
    
    @keyframes ticker-data-v-b97123a0 {
      0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
      }
    
      to {
        -webkit-transform: translateX(-80%);
        transform: translateX(-80%);
      }
    }
    keyframes fadeInUp-data-v-4bd3283c {
      0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
      }
    
      to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
      }
    }
    
    @-webkit-keyframes fadeIn-data-v-4bd3283c {
      0% {
        opacity: 0;
      }
    
      to {
        opacity: 1;
      }
    }
    
    @keyframes fadeIn-data-v-4bd3283c {
      0% {
        opacity: 0;
      }
    
      to {
        opacity: 1;
      }
    }
    
    /* ====== 記事一覧 ====== */
    .archive__inner_top {
      width: calc(100vw - 15rem);
      height: auto;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      gap: 42px;
      margin: 0px auto 20px auto;
      padding: 0;
    }
    .archive__inner{
      width: calc(100vw - 15rem);
      height: auto;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      gap: 42px;
      margin: 20px auto;
      padding: 0 0 0 0;
    }
    .archive__item__inner {
      width: calc(100vw - 15rem);
      height: auto;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-start;
      margin: 20px auto;
    }
    .archive__list {
      background-color: transparent;
      width: calc(100% / 2);
      height: auto;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      flex-direction: column;
      justify-content: start;
      align-items: start;
      flex-wrap: wrap;
      object-fit: cover;
    }
    .design__title{
      font-size: 10px;
      color: #919191;
      letter-spacing: .2em;
      display: block;
      margin: 10px 0 0 0;
    }
    .hashtag{
      font-size: 10px;
      text-transform: uppercase;
      color: #919191;
      letter-spacing: .2em;
      display: flex;
      align-items: center;
      justify-content: start;
      margin: 0;
    }
    .hashtag .hashtag__style{
      margin: 0 10px 0 0;
    }
    .archive__title {
      font-size: 13px;
      font-weight: 600;
      color: #000;
      margin-bottom: 8px;
      letter-spacing: .1em;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .archive__list img{
     width: 100%;
      object-fit: cover;
    }
    
    .archive__item {
      background-color:transparent;
      width: calc(100% / 4 - 32px);
      height: auto;
      margin-right: 42px;
      margin-bottom: 14px;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: start;
      align-items: start;
      flex-direction: column;
      flex-wrap: wrap;
      object-fit: cover;
      padding: 0;
    }
    .archive__item img{
     width: 100%;
      object-fit: cover;
    }
    
    .archive__item:nth-of-type(4n) {
        margin-right: 0;
    }
    .archive__thumbnail {
        transition: .3s;
    }
    .archive__thumbnail a img {
      transition: .3s;
    }
    .archive__thumbnail:hover {
        opacity: .7;
    }
    .archive__caption {
        margin-bottom: 6px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .archive__caption,
    .category__list {
        font-size: 10px;
        color: #919191;
        letter-spacing: .2em;
    }
    .category__list a {
        font-family: var(--en-font);
        color: #919191;
        margin-right: 14px;
    }
    .archive__title {
        font-size: 12px;
        font-weight: 600;
        color: #000;
        margin-bottom: 8px;
        letter-spacing: .1em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .category__list {
        display: flex;
        display: -webkit-flex;
        display: -ms-flexbox;
        justify-content: start;
        align-items: center;
        flex-wrap: wrap;
    }
    .category__item {
        font-family: var(--en-font);
        margin-right: 14px;
    }
    
    /* ====== TOPページ記事一覧の上部2枚 ====== */
    .archive__catch {
        display: flex;
        justify-content: center;
        gap: 42px;
        margin-bottom: 14px;
    }
    .archive__catch a img {
        margin-bottom: 12px;
    }
    .fadein.js-target {
      opacity: 1;
    }
    .js-target {
      opacity: 0;
      transition: all 1000ms;
    }
    .more__button {
        max-width: 70px;
        margin: 0 auto;
        color: #000;
        font-size: 16px;
        font-family: var(--en-font);
        letter-spacing: 0.05em;
        margin-bottom: 86px;
        padding-bottom: 6px;
        border-bottom: 2px solid #000;
        display: flex;
        display: -webkit-flex;
        display: -ms-flexbox;
        justify-content: end;
        align-items: center;
    }
    .more__button::after {
        content: '';
        background: url(../img/arrow_black.svg) center no-repeat;
        background-size: contain;
        display: inline-block;
        margin-top: 2px;
        margin-left: 8px;
        width: 20px;
        height: 6px;
    }
    
    /* ====== FOOTER ====== */
    .fp-watermark{
      display: none;
    }
    .foot {
      position: relative;
      z-index: 9;
    }
    .foot__area {
      width: 100%;
      padding: 52px 48px 45px 48px;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: space-between;
      align-items: center;
      background: #000;
      color: #fff;
    }
    .foot__area .foot__left {
      max-width: 720px;
      text-align: left;
    }
    .foot__title {
      font-size: 18px;
      font-weight: bold;
      letter-spacing: 0.15em;
    }
    .foot__text {
      font-size: 12px;
      font-weight: 500;
      letter-spacing: .2em;
      line-height: 2;
      margin-top: 14px;
    }
    .foot__area .foot__right {
      width: 434px;
    }
    .foot__button {
      background: #fff;
      line-height: 5;
      letter-spacing: .1em;
      opacity: 1;
    }
    .foot__area .foot__right {
      transition: .3s;
    }
    .foot__area .foot__right:hover {
      opacity: .7;
    }
    .foot__button a {
      font-size: 14px;
      color: #000;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: center;
      align-items: center;
    }
    .foot__button a::before {
      content: '';
      background: url(../images/mail_black.svg) no-repeat;
      background-size: contain;
      width: 14px;
      height: 14px;
      margin-right: 8px;
    }
    .foot__info {
      background: #fff;
      padding: 40px 48px;
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: space-between;
      align-items: center;
    }
    .foot__logo {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      align-items: end;
      margin-bottom: 18px;
    }
    .foot__logo a img {
      max-width: 107px;
      vertical-align: baseline;
    }
    .foot__logo .ja {
      min-width: 100px;
      font-size: 11px;
      letter-spacing: .2em;
      line-height: 1;
      margin-left: 14px;
      display: block;
    }
    .foot__address,
    .foot__num,
    .foot__time,
    .foot__url {
      font-size: 12px;
      letter-spacing: .2em;
      line-height: 1;
      margin-bottom: 14px;
      text-align: left;
    }
    .foot__num {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
    }
    .foot__num p {
      letter-spacing: .2em;
    }
    .foot__num p:nth-of-type(1) {
      margin-right: 24px;
    }
    .foot__fax span {
      display: inline-block;
    }
    .foot__url a {
      display: inline-block;
    }
    .foot__nav {
      margin-bottom: 30px;
    }
    .foot__nav__list {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
    }
    .foot__nav__item {
      font-family: var(--en-font);
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-align: center;
      margin-right: 36px;
    }
    .foot__nav__item:nth-of-type(5) {
      opacity: .2;
    }
    .foot__nav__item:last-child {
      margin-right: 0;
    }
    .foot__nav__item .ja {
      display: block;
      margin-top: 8px;
      font-size: 10px;
      font-weight: 400;
      letter-spacing: .2em;
    }
    .foot__link {
    display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    justify-content: end;
    margin-bottom: 26px;
    }
    .foot__link a {
    display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    align-items: center;
    font-size: 10px;
    letter-spacing: 0.08em;
    }
    .foot__link a::before {
    content: '';
    width: 5px;
    height: 5px;
    margin-right: 6px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
    }
    .foot__link a:nth-of-type(1) {
      margin-right: 30px;
    }
    .foot__sns .sns__list {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: end;
      align-items: center;
      margin-bottom: 28px;
    }
    .foot__sns .sns__item {
      margin-right: 14px;
    }
    .foot__sns .sns__item:last-child {
      margin-right: 0;
    }
    .foot__sns .sns__list a {
      width: 14.5px;
      height: 14.5px;
    }
    .foot__right .copyright {
      font-family: var(--en-font);
      font-size: 10px;
      letter-spacing: .1em;
      text-align: right;
    }