.elementor-widget-container .premium-global-cursor-{{ID}}{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-widget-container.premium-cursor-ftext .premium-global-cursor-{{ID}} .premium-cursor-follow-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-container .premium-global-badge-{{ID}} .premium-badge-text{color:var( --e-global-color-secondary );}.elementor-widget-container .premium-global-badge-{{ID}} .premium-badge-container{background-color:var( --e-global-color-primary );}.elementor-widget-container .premium-global-badge-{{ID}} .premium-badge-icon{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-1381 .elementor-element.elementor-element-f4b7f07{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-html .premium-global-cursor-{{ID}}{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-widget-html.premium-cursor-ftext .premium-global-cursor-{{ID}} .premium-cursor-follow-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-html .premium-global-badge-{{ID}} .premium-badge-text{color:var( --e-global-color-secondary );}.elementor-widget-html .premium-global-badge-{{ID}} .premium-badge-container{background-color:var( --e-global-color-primary );}.elementor-widget-html .premium-global-badge-{{ID}} .premium-badge-icon{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-1381 .elementor-element.elementor-element-e5b3d1b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1381 .elementor-element.elementor-element-e5b3d1b:not(.elementor-motion-effects-element-type-background), .elementor-1381 .elementor-element.elementor-element-e5b3d1b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}.elementor-1381 .elementor-element.elementor-element-2b08b16{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-cc81b0e *//* =========================================
   CRAZY FORK
   HERO 2026
   ========================================= */

.cfHero{
  --cf-green:#53ff00;
  --cf-red:#d92720;

  position:relative;

  width:100%;
  height:100svh;
  min-height:720px;

  overflow:hidden;
  isolation:isolate;

  background:#050505;
  color:#fff;
}


/* =========================================
   BACKGROUND
   ========================================= */

.cfHero__visual{
  position:absolute;
  inset:-2%;

  z-index:0;

  background-image:
    url("https://crazy-fork.art/wp-content/uploads/2026/08/FV-2.webp");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  transform:scale(1.045);

  filter:
    contrast(1.05)
    saturate(.95)
    brightness(.90);

  opacity:0;

  transition:
    opacity 1.2s ease,
    transform 3s cubic-bezier(.16,.8,.2,1);
}

.cfHero.is-loaded .cfHero__visual{
  opacity:1;
  transform:scale(1);
}


/* =========================================
   DARK SHADE
   左側だけしっかり暗く
   右側の車両はなるべくそのまま見せる
   ========================================= */

.cfHero__shade{
  position:absolute;
  inset:0;

  z-index:1;

  background:

    /* 左 → 右 */
    linear-gradient(
      90deg,
      rgba(0,0,0,.92) 0%,
      rgba(0,0,0,.76) 18%,
      rgba(0,0,0,.52) 31%,
      rgba(0,0,0,.26) 43%,
      rgba(0,0,0,.08) 55%,
      rgba(0,0,0,.015) 67%,
      rgba(0,0,0,0) 78%
    ),

    /* 上下の締め */
    linear-gradient(
      180deg,
      rgba(0,0,0,.16) 0%,
      rgba(0,0,0,0) 34%,
      rgba(0,0,0,0) 65%,
      rgba(0,0,0,.12) 80%,
      rgba(0,0,0,.55) 100%
    );
}


/* =========================================
   SUBTLE GRAIN
   ========================================= */

.cfHero__grain{
  position:absolute;
  inset:0;

  z-index:2;

  pointer-events:none;

  opacity:.11;

  background-image:
    repeating-radial-gradient(
      circle at 0 0,
      rgba(255,255,255,.12) 0,
      rgba(255,255,255,.12) .5px,
      transparent .6px,
      transparent 3px
    );

  mix-blend-mode:soft-light;
}


/* =========================================
   CONTENT
   ========================================= */

.cfHero__inner{
  position:relative;

  z-index:10;

  width:min(1560px, calc(100% - 120px));
  height:100%;

  margin:0 auto;

  display:flex;
  align-items:center;
}

.cfHero__content{
  width:min(860px, 51vw);

  padding-top:10px;

  opacity:0;
  transform:translateY(30px);

  transition:
    opacity .9s ease .15s,
    transform 1.15s cubic-bezier(.16,.8,.2,1) .15s;
}

.cfHero.is-loaded .cfHero__content{
  opacity:1;
  transform:translateY(0);
}


/* =========================================
   LOGO
   ========================================= */

.cfHero__logoWrap{
  margin-bottom:24px;
}

.cfHero__logo{
  display:block;

  width:clamp(180px, 18vw, 285px);
  height:auto;

  filter:
    drop-shadow(0 7px 20px rgba(0,0,0,.55));
}


/* =========================================
   EYEBROW
   ========================================= */

.cfHero__eyebrow{
  position:relative;

  margin:0 0 22px;
  padding-left:43px;

  font-family:
    "Arial Narrow",
    "Helvetica Neue",
    Arial,
    sans-serif;

  font-size:11px;
  font-weight:700;

  letter-spacing:.34em;

  color:rgba(255,255,255,.62);
}

.cfHero__eyebrow::before{
  content:"";

  position:absolute;

  left:0;
  top:50%;

  width:28px;
  height:1px;

  background:var(--cf-green);

  transform:translateY(-50%);
}


/* =========================================
   MAIN COPY
   PCは指定改行だけ
   ========================================= */

.cfHero__copy{
  min-height:2.5em;

  margin:0;

  white-space:pre;
  word-break:keep-all;
  overflow-wrap:normal;

  font-family:
    "Noto Sans JP",
    "Helvetica Neue",
    Arial,
    sans-serif;

  font-size:clamp(42px, 4.2vw, 72px);

  font-weight:900;

  line-height:1.22;
  letter-spacing:.025em;

  color:#fff;

  text-shadow:
    0 4px 26px rgba(0,0,0,.65),
    0 1px 0 rgba(255,255,255,.15);
}

.cfHero__copy.is-complete{
  animation:cfCopyLock .38s ease both;
}

@keyframes cfCopyLock{

  0%{
    filter:blur(.7px);
    opacity:.84;
  }

  100%{
    filter:blur(0);
    opacity:1;
  }

}


/* =========================================
   SUB COPY
   ========================================= */

.cfHero__sub{
  margin:24px 0 0;

  font-size:clamp(12px, 1.05vw, 15px);

  font-weight:500;

  letter-spacing:.16em;

  color:rgba(255,255,255,.52);
}


/* =========================================
   PAINT
   ========================================= */

.cfHero__paint{
  position:absolute;
  inset:0;

  z-index:5;

  pointer-events:none;

  overflow:hidden;
}

.cfPaint{
  position:absolute;

  display:block;

  width:240px;
  aspect-ratio:1;

  opacity:0;

  background:currentColor;

  -webkit-mask-image:
    url("https://crazy-fork.art/wp-content/uploads/2025/02/crazyfork-penki-8.webp");

  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;

  mask-image:
    url("https://crazy-fork.art/wp-content/uploads/2025/02/crazyfork-penki-8.webp");

  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;

  mix-blend-mode:screen;

  filter:
    contrast(1.05)
    saturate(1.1);

  transition:
    opacity .5s ease,
    transform .8s cubic-bezier(.12,.9,.16,1);
}


/* GREEN / LEFT TOP */

.cfPaint--01{
  width:320px;

  left:-155px;
  top:-125px;

  color:var(--cf-green);

  transform:
    rotate(-20deg)
    scale(.5);
}

.cfHero.is-loaded .cfPaint--01{
  opacity:.13;

  transform:
    rotate(-20deg)
    scale(1);

  transition-delay:.35s;
}


/* RED / RIGHT */

.cfPaint--02{
  width:220px;

  right:-100px;
  top:10%;

  color:var(--cf-red);

  transform:
    rotate(18deg)
    scale(.5);
}

.cfHero.is-loaded .cfPaint--02{
  opacity:.13;

  transform:
    rotate(18deg)
    scale(1);

  transition-delay:.48s;
}


/* GREEN / LEFT LOWER */

.cfPaint--03{
  width:160px;

  left:22%;
  bottom:-80px;

  color:var(--cf-green);

  transform:
    rotate(12deg)
    scale(.4);
}

.cfHero.is-loaded .cfPaint--03{
  opacity:.08;

  transform:
    rotate(12deg)
    scale(1);

  transition-delay:.62s;
}


/* WHITE / RIGHT LOWER */

.cfPaint--04{
  width:145px;

  right:19%;
  bottom:-80px;

  color:#fff;

  transform:
    rotate(-31deg)
    scale(.45);
}

.cfHero.is-loaded .cfPaint--04{
  opacity:.045;

  transform:
    rotate(-31deg)
    scale(1);

  transition-delay:.74s;
}


/* SMALL RED */

.cfPaint--05{
  width:80px;

  left:43%;
  top:4%;

  color:var(--cf-red);

  transform:
    rotate(40deg)
    scale(.3);
}

.cfHero.is-loaded .cfPaint--05{
  opacity:.075;

  transform:
    rotate(40deg)
    scale(1);

  transition-delay:.86s;
}


/* =========================================
   SCROLL
   ========================================= */

.cfHero__scroll{
  position:absolute;

  z-index:12;

  left:50%;
  bottom:30px;

  display:flex;
  flex-direction:column;
  align-items:center;

  gap:9px;

  transform:translateX(-50%);

  color:rgba(255,255,255,.4);
}

.cfHero__scroll span{
  font-size:8px;
  font-weight:700;

  letter-spacing:.3em;

  writing-mode:vertical-rl;
}

.cfHero__scroll i{
  display:block;

  width:1px;
  height:45px;

  overflow:hidden;

  background:rgba(255,255,255,.13);
}

.cfHero__scroll i::after{
  content:"";

  display:block;

  width:100%;
  height:16px;

  background:#fff;

  animation:cfScroll 1.8s ease-in-out infinite;
}

@keyframes cfScroll{

  0%{
    transform:translateY(-18px);
  }

  100%{
    transform:translateY(48px);
  }

}


/* =========================================
   BOTTOM TRANSITION
   ========================================= */

.cfHero::after{
  content:"";

  position:absolute;

  left:0;
  right:0;
  bottom:0;

  height:125px;

  z-index:8;

  pointer-events:none;

  background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,0),
      rgba(0,0,0,.45) 66%,
      #000 100%
    );
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width:1024px){

  .cfHero{
    min-height:680px;
  }

  .cfHero__inner{
    width:calc(100% - 64px);
  }

  .cfHero__content{
    width:58vw;
  }

  .cfHero__visual{
    background-position:61% center;
  }

  .cfHero__copy{
    font-size:clamp(38px, 4.5vw, 60px);
  }

}


/* =========================================
   SMARTPHONE
   ========================================= */

@media (max-width:767px){

  .cfHero{
    height:100svh;
    min-height:650px;
  }


  /* IMAGE */

  .cfHero__visual{
    inset:0;

    background-size:cover;
    background-position:67% center;

    filter:
      contrast(1.03)
      saturate(.92)
      brightness(.78);
  }


  /* SHADE */

  .cfHero__shade{
    background:

      linear-gradient(
        180deg,
        rgba(0,0,0,.62) 0%,
        rgba(0,0,0,.25) 28%,
        rgba(0,0,0,.15) 55%,
        rgba(0,0,0,.78) 100%
      ),

      linear-gradient(
        90deg,
        rgba(0,0,0,.72) 0%,
        rgba(0,0,0,.30) 56%,
        rgba(0,0,0,.08) 100%
      );
  }


  /* CONTENT */

  .cfHero__inner{
    width:calc(100% - 40px);

    align-items:flex-start;
  }

  .cfHero__content{
    width:100%;

    padding-top:
      clamp(120px, 19vh, 175px);
  }


  /* LOGO */

  .cfHero__logoWrap{
    margin-bottom:18px;
  }

  .cfHero__logo{
    width:175px;
  }


  /* EYEBROW */

  .cfHero__eyebrow{
    margin-bottom:17px;

    padding-left:34px;

    font-size:8px;

    letter-spacing:.26em;
  }

  .cfHero__eyebrow::before{
    width:22px;
  }


  /* MAIN COPY */

  .cfHero__copy{
    min-height:2.7em;

    white-space:pre-wrap;
    word-break:keep-all;
    overflow-wrap:normal;

    font-size:clamp(31px, 8.8vw, 43px);

    line-height:1.28;
    letter-spacing:.01em;
  }


  /* SUB COPY */

  .cfHero__sub{
    max-width:320px;

    margin-top:18px;

    font-size:10px;

    line-height:1.8;

    letter-spacing:.12em;
  }


  /* PAINT */

  .cfPaint--01{
    width:190px;

    left:-105px;
    top:-50px;
  }

  .cfPaint--02{
    width:110px;

    right:-50px;
    top:18%;
  }

  .cfPaint--03{
    width:100px;

    left:-35px;
    bottom:4%;
  }

  .cfPaint--04,
  .cfPaint--05{
    display:none;
  }


  /* SCROLL */

  .cfHero__scroll{
    left:auto;
    right:13px;
    bottom:22px;

    transform:none;
  }

}


/* =========================================
   REDUCED MOTION
   ========================================= */

@media (prefers-reduced-motion:reduce){

  .cfHero__visual,
  .cfHero__content,
  .cfPaint{
    transition:none;
  }

  .cfHero__scroll i::after{
    animation:none;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d6a621a *//* =========================================
   CRAZY FORK
   GALLERY 2026
========================================= */

.cfGallery{
  --green:#53ff00;
  --red:#d92720;

  position:relative;

  padding:
    clamp(90px, 9vw, 160px)
    0
    clamp(110px, 10vw, 180px);

  overflow:hidden;

  background:#050505;

  color:#fff;
}


/* =========================================
   INNER
========================================= */

.cfGallery__inner{
  position:relative;
  z-index:3;

  width:min(
    1500px,
    calc(100% - 100px)
  );

  margin:0 auto;
}


/* =========================================
   HEAD
========================================= */

.cfGallery__head{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    360px;

  gap:70px;

  align-items:end;

  margin-bottom:
    clamp(50px, 5vw, 85px);
}


/* LEFT */

.cfGallery__label{
  display:flex;

  align-items:center;

  gap:14px;

  margin:0 0 18px;

  font-family:
    Arial,
    sans-serif;

  font-size:10px;

  font-weight:700;

  letter-spacing:.32em;

  color:rgba(255,255,255,.52);
}

.cfGallery__label span{
  display:block;

  width:30px;
  height:1px;

  background:var(--green);
}


.cfGallery__title{
  min-height:1.2em;

  margin:0;

  font-size:
    clamp(42px, 5vw, 76px);

  font-weight:900;

  line-height:1;

  letter-spacing:.035em;

  color:#fff;
}


/* RIGHT */

.cfGallery__headRight{
  padding-bottom:4px;
}

.cfGallery__headRight p{
  margin:0;

  font-size:
    clamp(12px, 1vw, 14px);

  line-height:2;

  letter-spacing:.09em;

  color:rgba(255,255,255,.48);
}


/* animation */

.cfGallery__head{
  opacity:0;

  transform:
    translateY(24px);
}

.cfGallery.is-on
.cfGallery__head{
  animation:
    cfGalleryFade
    .9s
    cubic-bezier(.16,.8,.2,1)
    forwards;
}


/* =========================================
   GRID
========================================= */

.cfGallery__grid{
  display:grid;

  grid-template-columns:
    1.35fr
    .65fr;

  grid-template-rows:
    auto
    auto;

  gap:
    clamp(36px, 4vw, 70px)
    clamp(24px, 3vw, 48px);
}


/* =========================================
   ITEM
========================================= */

.cfGallery__item{
  margin:0;

  opacity:0;

  transform:
    translateY(30px);

  position:relative;
}


.cfGallery__item--main{
  grid-column:1;
  grid-row:1 / span 2;
}


.cfGallery__item--sub{
  grid-column:2;
}


.cfGallery__item--wide{
  grid-column:1 / -1;

  margin-top:
    clamp(25px, 3vw, 50px);
}


/* stagger */

.cfGallery.is-on
.cfGallery__item{
  animation:
    cfGalleryFade
    1s
    cubic-bezier(.16,.8,.2,1)
    forwards;
}

.cfGallery.is-on
.cfGallery__item:nth-child(1){
  animation-delay:.16s;
}

.cfGallery.is-on
.cfGallery__item:nth-child(2){
  animation-delay:.25s;
}

.cfGallery.is-on
.cfGallery__item:nth-child(3){
  animation-delay:.34s;
}

.cfGallery.is-on
.cfGallery__item:nth-child(4){
  animation-delay:.43s;
}


@keyframes cfGalleryFade{

  from{
    opacity:0;

    transform:
      translateY(30px);
  }

  to{
    opacity:1;

    transform:
      translateY(0);
  }

}


/* =========================================
   MEDIA
========================================= */

.cfGallery__media{
  position:relative;

  display:block;

  width:100%;

  padding:0;

  overflow:hidden;

  border:0;

  background:#111;

  cursor:pointer;

  text-align:left;
}


/* MAIN */

.cfGallery__item--main
.cfGallery__media{
  aspect-ratio:4 / 5;
}


/* SUB */

.cfGallery__item--sub
.cfGallery__media{
  aspect-ratio:4 / 3;
}


/* WIDE */

.cfGallery__item--wide
.cfGallery__media{
  aspect-ratio:16 / 6;
}


/* IMG */

.cfGallery__media img{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  display:block;

  transform:scale(1.01);

  filter:
    contrast(1.06)
    saturate(.96);

  transition:
    transform .85s
    cubic-bezier(.16,.8,.2,1),
    filter .6s ease;
}


/* dark gradient */

.cfGallery__overlay{
  position:absolute;
  inset:0;

  pointer-events:none;

  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,0) 50%,
      rgba(0,0,0,.48) 100%
    );

  opacity:.7;

  transition:
    opacity .5s ease;
}


/* green line */

.cfGallery__media::after{
  content:"";

  position:absolute;

  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:var(--green);

  transition:
    width .65s
    cubic-bezier(.16,.8,.2,1);
}


/* VIEW */

.cfGallery__zoom{
  position:absolute;

  right:20px;
  top:20px;

  display:flex;

  align-items:center;

  gap:8px;

  font-size:9px;

  font-weight:700;

  letter-spacing:.24em;

  color:#fff;

  opacity:0;

  transform:
    translateY(-8px);

  transition:
    opacity .35s ease,
    transform .35s ease;
}


.cfGallery__zoom i{
  display:grid;

  place-items:center;

  width:25px;
  height:25px;

  border:
    1px solid
    rgba(255,255,255,.35);

  font-style:normal;

  font-size:15px;
}


/* =========================================
   META
========================================= */

.cfGallery__meta{
  display:grid;

  grid-template-columns:
    42px
    1fr;

  gap:18px;

  padding-top:18px;
}


.cfGallery__num{
  padding-top:1px;

  font-size:10px;

  font-weight:700;

  letter-spacing:.1em;

  color:var(--green);
}


.cfGallery__type{
  display:block;

  margin-bottom:7px;

  font-family:
    Arial,
    sans-serif;

  font-size:9px;

  font-weight:700;

  letter-spacing:.24em;

  color:
    rgba(255,255,255,.38);
}


.cfGallery__meta p{
  margin:0;

  font-size:
    clamp(13px, 1vw, 15px);

  font-weight:600;

  line-height:1.7;

  letter-spacing:.055em;

  color:
    rgba(255,255,255,.78);
}


/* =========================================
   HOVER
========================================= */

@media (hover:hover){

  .cfGallery__media:hover img{
    transform:
      scale(1.045);

    filter:
      contrast(1.08)
      saturate(1.05);
  }

  .cfGallery__media:hover
  .cfGallery__overlay{
    opacity:.45;
  }

  .cfGallery__media:hover::after{
    width:100%;
  }

  .cfGallery__media:hover
  .cfGallery__zoom{
    opacity:1;

    transform:
      translateY(0);
  }

}


/* =========================================
   PAINT
========================================= */

.cfGallery__paint{
  position:absolute;
  inset:0;

  z-index:1;

  pointer-events:none;
}


.cfGalleryPaint{
  position:absolute;

  display:block;

  background:currentColor;

  opacity:0;

  -webkit-mask-image:
    url("https://crazy-fork.art/wp-content/uploads/2025/02/crazyfork-penki-8.webp");

  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:contain;
  -webkit-mask-position:center;

  mask-image:
    url("https://crazy-fork.art/wp-content/uploads/2025/02/crazyfork-penki-8.webp");

  mask-repeat:no-repeat;
  mask-size:contain;
  mask-position:center;

  mix-blend-mode:screen;
}


.cfGalleryPaint--01{
  width:330px;
  aspect-ratio:1;

  left:-150px;
  top:24%;

  color:var(--green);

  transform:
    rotate(-16deg)
    scale(.7);
}


.cfGalleryPaint--02{
  width:210px;
  aspect-ratio:1;

  right:-100px;
  bottom:13%;

  color:var(--red);

  transform:
    rotate(18deg)
    scale(.7);
}


.cfGallery.is-on
.cfGalleryPaint--01{
  animation:
    cfGalleryPaint
    .8s
    ease
    .35s
    forwards;
}


.cfGallery.is-on
.cfGalleryPaint--02{
  animation:
    cfGalleryPaintRed
    .8s
    ease
    .5s
    forwards;
}


@keyframes cfGalleryPaint{

  to{
    opacity:.09;

    transform:
      rotate(-16deg)
      scale(1);
  }

}


@keyframes cfGalleryPaintRed{

  to{
    opacity:.075;

    transform:
      rotate(18deg)
      scale(1);
  }

}


/* =========================================
   LIGHTBOX
========================================= */

.cfGalleryLB{
  position:fixed;

  inset:0;

  z-index:99999;

  display:flex;

  align-items:center;
  justify-content:center;

  padding:40px;

  background:
    rgba(0,0,0,.94);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transition:
    opacity .35s ease,
    visibility .35s ease;
}


.cfGalleryLB.is-open{
  opacity:1;

  visibility:visible;

  pointer-events:auto;
}


.cfGalleryLB__img{
  display:block;

  max-width:
    min(1400px, 92vw);

  max-height:88vh;

  width:auto;
  height:auto;

  object-fit:contain;

  box-shadow:
    0 30px 100px
    rgba(0,0,0,.8);
}


.cfGalleryLB__close{
  position:absolute;

  right:28px;
  top:24px;

  width:46px;
  height:46px;

  padding:0;

  border:0;

  background:transparent;

  color:#fff;

  font-size:34px;

  font-weight:200;

  cursor:pointer;

  opacity:.65;

  transition:
    opacity .2s ease,
    transform .2s ease;
}


.cfGalleryLB__close:hover{
  opacity:1;

  transform:
    rotate(90deg);
}


/* =========================================
   TABLET
========================================= */

@media (max-width:1024px){

  .cfGallery__inner{
    width:
      calc(100% - 64px);
  }

  .cfGallery__head{
    grid-template-columns:
      1fr
      280px;

    gap:40px;
  }

}


/* =========================================
   SMARTPHONE
========================================= */

@media (max-width:767px){

  .cfGallery{
    padding:
      85px
      0
      110px;
  }


  .cfGallery__inner{
    width:
      calc(100% - 38px);
  }


  /* HEAD */

  .cfGallery__head{
    display:block;

    margin-bottom:45px;
  }


  .cfGallery__headRight{
    margin-top:24px;
  }


  .cfGallery__title{
    font-size:
      clamp(38px, 12vw, 54px);
  }


  .cfGallery__headRight p{
    font-size:11px;

    line-height:1.9;
  }


  /* GRID */

  .cfGallery__grid{
    display:block;
  }


  .cfGallery__item{
    margin-bottom:50px;
  }


  .cfGallery__item--main
  .cfGallery__media,

  .cfGallery__item--sub
  .cfGallery__media,

  .cfGallery__item--wide
  .cfGallery__media{
    aspect-ratio:4 / 3;
  }


  /* main only taller */

  .cfGallery__item--main
  .cfGallery__media{
    aspect-ratio:4 / 5;
  }


  .cfGallery__meta{
    padding-top:14px;
  }


  .cfGallery__zoom{
    opacity:1;

    transform:none;

    right:12px;
    top:12px;
  }


  /* PAINT */

  .cfGalleryPaint--01{
    width:180px;

    left:-110px;
  }


  .cfGalleryPaint--02{
    width:120px;

    right:-70px;
  }


  /* LB */

  .cfGalleryLB{
    padding:18px;
  }


  .cfGalleryLB__close{
    right:12px;
    top:10px;
  }

}


/* =========================================
   REDUCED MOTION
========================================= */

@media (prefers-reduced-motion:reduce){

  .cfGallery__head,
  .cfGallery__item,
  .cfGalleryPaint{
    opacity:1 !important;

    transform:none !important;

    animation:none !important;
  }

}/* End custom CSS */