@charset "UTF-8";

@keyframes fade_in {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fade_out {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes scale_up {
  0% { transform: scale(0.96); }
  100% { transform: scale(1); }
}

@keyframes scale_down {
  0% { transform: scale(1); }
  100% { transform: scale(0.96); }
}

@keyframes slide_in {
  0% { transform: translateX(-8%); }
  100% { transform: translateX(0); }
}

@keyframes rotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes clip_in {
  0% { clip-path: inset(0 100% 0 0); }
  100% { clip-path: inset(0); }
}

@keyframes trace_in {
  0% { transform: translateX(-101%); }
  40%, 60% { transform: translateX(0); }
  100% { transform: translateX(101%); }
}

@keyframes blur_in {
  0% { filter: blur(1.6rem); }
  100% { filter: blur(0); }
}


/*============================================================
  motion
============================================================*/
.motion-in-clip {
  clip-path: inset(0 100% 0 0);
}

.motion-in-clip.in {
  animation: clip_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both;
}

html.chrome span.motion-in-clip {
  display: inline-block;
}

html.chrome .motion-in-clip {
  clip-path: inset(0);
  opacity: 0;
}

html.chrome .motion-in-clip.in {
  opacity: 1;
}

.motion-in-blur {
  opacity: 0;
  filter: blur(8rem);
}

.motion-in-blur.in {
  animation: fade_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both, blur_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both;
}

.motion-in-fade {
  opacity: 0;
}

.motion-in-fade.in {
  animation: fade_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both;
}

.motion-in-fade-scale {
  opacity: 0;
  transform: scale(0.96);
}

.motion-in-fade-scale.in {
  animation: fade_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both, scale_up 0.8s cubic-bezier(0.83, 0, 0.17, 1) both;
}

.motion-in-fade-clip {
  clip-path: inset(0 100% 0 0);
  opacity: 0;
}

.motion-in-fade-clip.in {
  animation: fade_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both, clip_in 0.8s cubic-bezier(0.83, 0, 0.17, 1) both;
}

html.chrome span.motion-in-fade-clip {
  display: inline-block;
}

html.chrome .motion-in-fade-clip {
  clip-path: inset(0);
  opacity: 0;
}

html.chrome .motion-in-fade-clip.in {
  opacity: 1;
}


/*============================================================
  hover
============================================================*/
@media (hover: hover) {
  .button-prev,
  .button-next,
  .button-pulldown,
  .input-submit,
  .page-numbers,
  .a-link-button,
  .a-link-bar .icon,
  .a-link-pagetop .icon,
  .a-link-content .icon,
  .a-link-video .icon,
  .a-link-article::after {
    transition: background 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  }

  a .figure-image img,
  a .figure-banner img {
    transition: filter 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .a-link-content {
    transition: border 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  }
}


/*============================================================
  header
============================================================*/
#header-global {
  transition: background 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes header_in {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(0); }
}

#header-global.floating {
  animation: header_in 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

#header-global .button-menu::before,
#header-global .button-menu::after {
  transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

#header-global .nav-header-table {
  opacity: 0;
  transform: translateX(1.6rem);
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

#header-global .button-menu.active + .nav-header-table {
  opacity: 1;
  transform: translateX(0);
}


/*============================================================
  div-slider-column
============================================================*/
.div-slider-column .div-slider-content .ul-slider {
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.div-slider-column .div-slider-content .ul-slider.return.prev {
  animation: slider_column_return_prev 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_column_return_prev {
  0% { right: 0; }
  50% { right: -0.64rem; }
  100% { right: 0; }
}

.div-slider-column .div-slider-content .ul-slider.return.next {
  animation: slider_column_return_next 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_column_return_next {
  0% { left: 0; }
  50% { left: -0.64rem; }
  100% { left: 0; }
}


/*============================================================
  div-slider-gallery
============================================================*/
.div-slider-gallery .div-slider-content .ul-slider > li.in.prev {
  animation: slider_gallery_in_prev 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_in_prev {
  0% { clip-path: inset(0 100% 0 0); transform: translateX(-3.2rem); filter: blur(8rem) brightness(2); }
  100% { clip-path: inset(0); transform: translateX(0); filter: blur(0) brightness(1); }
}

.div-slider-gallery .div-slider-content .ul-slider > li.out.prev {
  animation: slider_gallery_out_prev 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_out_prev {
  0% { transform: translateX(0); }
  100% { transform: translateX(1.6rem); }
}

.div-slider-gallery .div-slider-content .ul-slider > li.in.next {
  animation: slider_gallery_in_next 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_in_next {
  0% { clip-path: inset(0 0 0 100%); transform: translateX(3.2rem); filter: blur(8rem) brightness(2); }
  100% { clip-path: inset(0); transform: translateX(0); filter: blur(0) brightness(1); }
}

.div-slider-gallery .div-slider-content .ul-slider > li.out.next {
  animation: slider_gallery_out_next 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_out_next {
  0% { transform: translateX(0); }
  100% { transform: translateX(-1.6rem); }
}

.div-slider-gallery .div-slider-content .ul-slider > li.return.prev {
  animation: slider_gallery_return_prev 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_return_prev {
  0% { transform: translateX(0); }
  50% { transform: translateX(0.32rem); }
  100% { transform: translateX(0); }
}

.div-slider-gallery .div-slider-content .ul-slider > li.return.next {
  animation: slider_gallery_return_next 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_gallery_return_next {
  0% { transform: translateX(0); }
  50% { transform: translateX(-0.32rem); }
  100% { transform: translateX(0); }
}


/*============================================================
  div-slider-lineup
============================================================*/
.div-slider-lineup .div-slider-content .ul-slider {
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.div-slider-lineup .div-slider-content .ul-slider.return.prev {
  animation: slider_lineup_return_prev 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_lineup_return_prev {
  0% { right: 0; }
  50% { right: -0.64rem; }
  100% { right: 0; }
}

.div-slider-lineup .div-slider-content .ul-slider.return.next {
  animation: slider_lineup_return_next 0.8s cubic-bezier(0.76, 0, 0.24, 1) both;
}

@keyframes slider_lineup_return_next {
  0% { left: 0; }
  50% { left: -0.64rem; }
  100% { left: 0; }
}