@charset "UTF-8";
/* 
//////////////////////////////////////////////////////////////////////////////////////////
default settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
#CE251203collabo {
  --pc-width: 1200;
  --sp-width: 750;
  --pc-artboard-width: 500;
  --sp-artboard-width: 750;
  --formula: calc(var(--variable) * var(--ratio));
  --formula_pc: calc(var(--variable) * 1);
}

@media (min-width: 1201px) {
  #CE251203collabo {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
}

@media (min-width: 768px) and (max-width: 1200px) {
  #CE251203collabo {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
}

@media (max-width: 767px) {
  #CE251203collabo {
    --ratio: 1;
    --variable: calc(100vw / var(--sp-width));
  }
}

#CE251203collabo img {
  display: block;
  width: 100%;
  height: auto;
}

#CE251203collabo h2,
#CE251203collabo h3,
#CE251203collabo p,
#CE251203collabo li {
  margin-block: calc((1em - 1lh) / 2);
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: auto;
}

#CE251203collabo .invisible-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
/* 
//////////////////////////////////////////////////////////////////////////////////////////
common settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
#CE251203collabo {
  --white: #ffffff;
  --avenir: "avenir-lt-pro", sans-serif;
  --font-light: 200;
  position: relative;
  display: flex;
  flex-direction: column;
}
#CE251203collabo [class*="txt-"] {
  position: absolute;
  z-index: 5;
  pointer-events: none;
}
#CE251203collabo [class*="img-cont"] {
  position: relative;
  width: 100%;
}
#CE251203collabo [class*="img-cont"]:not(.img-cont1) {
  margin-top: calc(-1 * var(--formula));
}
#CE251203collabo [class*="__credit"] {
  position: absolute;
  bottom: calc(30 * var(--formula));
  left: calc(30 * var(--formula));
  font-family: var(--avenir);
  color: var(--white);
  font-size: calc(18 * var(--formula));
  line-height: 2;
  letter-spacing: 0.06em;
  text-align: left;
  font-weight: var(--font-light);
  z-index: 5;
  text-transform: uppercase;
  display: flex;
  flex-direction: column;
  gap: calc(14 * var(--formula));
}

#CE251203collabo [class*=""] {
}
#CE251203collabo [class*=""] {
}
#CE251203collabo [class*=""] {
}
#CE251203collabo [class*=""] {
}

#CE251203collabo .stagger-child {
  visibility: hidden;
}
.celford_btn {
  position: relative;
  z-index: 10;
}
/* 
//////////////////////////////////////////////////////////////////////////////////////////
layout settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
#CE251203collabo .lp-cont {
  position: relative;
  display: flex;
  top: 0;
  overflow-x: clip;
}

#CE251203collabo .mv-cont {
  flex: 7;
  width: auto;
  top: var(--lpHeaderHeight);
  position: sticky;
  height: calc(100dvh - var(--lpHeaderHeight, 80px));
  min-width: 0;
}
@media (max-width: 767px) {
  #CE251203collabo .lp-cont {
    flex-direction: column;
  }
  #CE251203collabo .mv-cont {
    position: relative;
    height: auto;
    top: 0;
  }
  #CE251203collabo .mv-txt-01 {
    position: absolute;
    left: 50.6%;
    bottom: calc(50 * var(--formula));
    transform: translate(-50%, 0);
  }
}

#CE251203collabo .mv-txt-01 {
  position: absolute;
  left: 49.9%;
  bottom: 10.42%;
  transform: translate(-50%, 0);
}
@media (max-width: 767px) {
  #CE251203collabo .lp-cont {
  }
  #CE251203collabo .mv-cont {
    position: relative;
    height: auto;
    top: 0;
  }
  #CE251203collabo .mv-txt-01 {
    position: absolute;
    left: 49.6%;
    bottom: calc(140 * var(--formula));
    transform: translate(-50%, 0);
  }
}

#CE251203collabo .lp-mv {
  width: 100%;
  height: 100%;
}

#CE251203collabo .lp-main-cont {
  flex: 5;
  width: auto;
  overflow-x: hidden;
  flex-shrink: 0;
}

@media (max-width: 767px) {
  #CE251203collabo .lp-main-cont {
    width: 100%;
  }
}

#CE251203collabo .img-cont1 {
}

#CE251203collabo .txt-01 {
  right: calc(-31 * var(--formula));
  top: 50.1%;
  transform: translateY(-50%);
}

#CE251203collabo .model-01 {
}

#CE251203collabo .img-cont1__inner {
}

#CE251203collabo .model-02 {
}

#CE251203collabo .img-cont1__credit {
}

#CE251203collabo .img-cont2 {
  padding: calc(95 * var(--formula)) 0 calc(131 * var(--formula)) 0;
  display: flex;
  justify-content: center;
}

#CE251203collabo .model-03 {
}

#CE251203collabo .txt-02 {
  bottom: calc(17 * var(--formula));
  left: 49%;
  transform: translateX(-50%);
}

#CE251203collabo .img-cont3 {
}

#CE251203collabo .model-04 {
}

#CE251203collabo .img-cont3__credit {
}

#CE251203collabo .img-cont4 {
}

#CE251203collabo .model-05 {
}

#CE251203collabo .img-cont4__credit {
}

#CE251203collabo .img-cont5 {
}

#CE251203collabo .model-06 {
  width: 100%;
  overflow: hidden;
}

#CE251203collabo .img-cont5__credit {
}

#CE251203collabo .pin-area-wrapper {
  width: 100%;
  height: max-content;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

#CE251203collabo .img-cont6 {
  width: 100%;
  height: auto;
  flex-shrink: 0;
  background: #eedac5;
}

#CE251203collabo .img-cont6__horizontal-cont {
  height: calc(1325 * var(--formula));
  width: 100%;
  flex-shrink: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
}

#CE251203collabo .txt-03 {
  position: relative;
  height: calc(100 * var(--formula));
  display: grid;
  align-items: center;
  left: calc(23 * var(--formula));
}

#CE251203collabo .model-07 {
}

#CE251203collabo .img-cont7 {
  flex-shrink: 0; /* 縮まないようにする */
  background: #f0f0f0; /* 分かりやすく色付けなど */
  z-index: 1;
}

#CE251203collabo .model-08 {
}

#CE251203collabo .img-cont8 {
}

#CE251203collabo .model-09 {
}

#CE251203collabo .txt-04 {
  top: calc(31 * var(--formula));
  left: calc(31 * var(--formula));
}

#CE251203collabo .img-cont9 {
}

#CE251203collabo .model-10 {
}

#CE251203collabo .img-cont10 {
  position: relative;
  width: 100%;
}

#CE251203collabo .img-cont10 .hover-fade-area {
  position: relative;
  width: 100%;
  overflow: hidden; /* 画像のはみ出し防止 */
}

/* 共通：画像自体のスタイル */
#CE251203collabo .img-cont10 .img-layer img {
  display: block;
  width: 100%;
  height: auto;
  transition: opacity 2.5s ease;
}

#CE251203collabo .img-cont10 .img-layer.base {
  display: block;
  position: relative;
  z-index: 1;
}

#CE251203collabo .img-cont10 .img-layer.hover {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
}

#CE251203collabo .img-cont10 .hover-fade-area:hover .img-layer.hover {
  opacity: 1;
}

#CE251203collabo .img-cont10__credit {
  bottom: calc(32 * var(--formula));
}
#CE251203collabo.lp-footer-spacer {
  width: 100%;
  position: relative;
  z-index: 0;
  pointer-events: none;
  height: 0;
}

#CE251203collabo .lp-footer-cont {
  position: absolute;
  display: flex;
  justify-content: center;
  background-image: url(../img/bg_pc.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  padding: calc(53 * var(--formula_pc) + 1px) 0 calc(52 * var(--formula_pc))
    calc(48 * var(--formula_pc));
  gap: calc(214 * var(--formula_pc));
  overflow: hidden;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  transform: none;
  box-sizing: border-box;
}
#CE251203collabo .snow-flake {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 1;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
}

@media (max-width: 767px) {
  #CE251203collabo .lp-footer-cont {
    flex-direction: column-reverse;
    padding: calc(94 * var(--formula)) calc(5 * var(--formula))
      calc(143 * var(--formula)) 0;
    gap: calc(34 * var(--formula));
    align-items: center;
    background-image: url(../img/bg_sp.jpg);
  }
}

#CE251203collabo .footer__txt-cont {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: calc(60 * var(--formula_pc)) 0 0 0;
  z-index: 2;
}

#CE251203collabo .footer-txt-01 {
  position: relative;
  margin: 0 calc(3 * var(--formula)) calc(107 * var(--formula)) 0;
}

#CE251203collabo .footer-txt-02 {
  position: relative;
  margin: 0 calc(-3 * var(--formula)) calc(31 * var(--formula)) 0;
}

#CE251203collabo .footer__credit {
  position: relative;
  text-align: center;
  font-size: calc(10 * var(--formula_pc));
  bottom: unset;
  left: unset;
  gap: calc(12 * var(--formula_pc));
}

@media (max-width: 767px) {
  #CE251203collabo .footer__credit {
    font-size: calc(18 * var(--formula));
    gap: calc(22 * var(--formula));
    margin: 0 calc(8 * var(--formula)) 0 0;
  }
  #CE251203collabo .footer-txt-01 {
    margin: 0 calc(2 * var(--formula)) calc(107 * var(--formula)) 0;
  }

  #CE251203collabo .footer-txt-02 {
    margin: 0 calc(-3 * var(--formula)) calc(25 * var(--formula)) 0;
  }
}

#CE251203collabo .footer__inner {
  position: relative;
  z-index: 2;
}

#CE251203collabo .txt-05 {
  bottom: calc(36 * var(--formula_pc));
  right: calc(38 * var(--formula_pc));
}
@media (max-width: 767px) {
  #CE251203collabo .txt-05 {
    bottom: calc(51 * var(--formula));
    right: calc(50 * var(--formula));
  }
}

#CE251203collabo .footer-model-01 {
}

/* 画像サイズ指定用クラス(__frame) */
#CE251203collabo .mv-txt-01__frame {
  width: calc(395 * (100vw / 1200));
}

#CE251203collabo .lp-mv__frame {
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  #CE251203collabo .lp-mv__frame {
    width: calc(750 * var(--formula));
    height: auto;
  }
  #CE251203collabo .mv-txt-01__frame {
    width: calc(574 * var(--formula));
  }
}
#CE251203collabo .lp-mv__frame a,
#CE251203collabo .lp-mv__frame picture,
#CE251203collabo .lp-mv__frame img {
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

#CE251203collabo .txt-01__frame {
  width: calc(195 * var(--formula));
}

#CE251203collabo .model-01__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .model-02__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .model-03__frame {
  width: calc(664 * var(--formula));
}

#CE251203collabo .txt-02__frame {
  width: calc(502 * var(--formula));
}

#CE251203collabo .model-04__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .model-05__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .model-06__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .txt-03__frame {
  width: calc(1458 * var(--formula));
}

#CE251203collabo .model-07__frame {
  width: calc(1500 * var(--formula));
}

#CE251203collabo .model-08__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .model-09__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .txt-04__frame {
  width: calc(341 * var(--formula));
}

#CE251203collabo .model-10__frame {
  width: calc(750 * var(--formula));
}

#CE251203collabo .footer-txt-01__frame {
  width: calc(351 * var(--formula_pc));
}

#CE251203collabo .footer-txt-02__frame {
  width: calc(54 * var(--formula_pc));
}

@media (max-width: 767px) {
  #CE251203collabo .footer-txt-01__frame {
    width: calc(574 * var(--formula));
  }
  #CE251203collabo .footer-txt-02__frame {
    width: calc(98 * var(--formula));
  }
}

#CE251203collabo .txt-05__frame {
  width: calc(56 * var(--formula_pc));
}

#CE251203collabo .footer-model-01__frame {
  width: calc(438 * var(--formula_pc));
}

/* SP用画像サイズ指定用クラス(__frame) */
@media (max-width: 767px) {
  #CE251203collabo .footer-model-01__frame {
    width: calc(664 * var(--formula));
  }
  #CE251203collabo .txt-05__frame {
    width: calc(99 * var(--formula));
  }
}