@charset "UTF-8";
/* 
//////////////////////////////////////////////////////////////////////////////////////////
default settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
#Contents {
  overflow: visible;
}
#FU260114mixmatch {
  --pc-width: 1400;
  --sp-width: 750;
  --pc-artboard-width: 460;
  --sp-artboard-width: 750;
  --formula: calc(var(--variable) * var(--ratio));
  --formula_pc: calc(var(--variable) * 1);
}

@media (min-width: 1401px) {
  #FU260114mixmatch {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: 1px;
  }
}

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

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

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

#FU260114mixmatch h2,
#FU260114mixmatch h3,
#FU260114mixmatch p,
#FU260114mixmatch li {
  margin-block: calc((1em - 1lh) / 2);
}

#FU260114mixmatch .invisible-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
/* 
//////////////////////////////////////////////////////////////////////////////////////////
animation settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
/* ブラーイン */
#FU260114mixmatch .blur-in {
  opacity: 0;
  filter: blur(10px);
  transition: all 1s ease-out;
}
#FU260114mixmatch .is-visible.blur-in {
  opacity: 1;
  filter: blur(0);
}
#FU260114mixmatch .stagger-item {
  opacity: 0;
  transform: translateY(calc(20 * var(--formula)));
  transition: all 1s ease-out;
}
#FU260114mixmatch .is-visible .stagger-item {
  opacity: 1;
  transform: translateY(calc(20 * var(--formula)));
}
#FU260114mixmatch .is-visible .stagger-item.delay1 {
  transition-delay: 0.3s;
}
#FU260114mixmatch .is-visible .stagger-item.delay2 {
  transition-delay: 0.6s;
}
#FU260114mixmatch .is-visible .stagger-item.delay3 {
  transition-delay: 0.9s;
}
#FU260114mixmatch .is-visible .stagger-item.delay4 {
  transition-delay: 1.2s;
}
#FU260114mixmatch .is-visible .stagger-item.delay5 {
  transition-delay: 1.5s;
}
#FU260114mixmatch .sticy-cont {
  position: -webkit-sticky;
  position: sticky;
  --current-h: calc(var(--base-h) * var(--formula));
  height: var(--current-h);
  top: calc(70vh - var(--current-h));
}
.sec05 {
  --base-h: 3000;
  z-index: 5;
}
.sec06 {
  --base-h: 2770;
  z-index: 6;
}
.sec07 {
  --base-h: 3160;
  z-index: 7;
}
.sec08 {
  --base-h: 3221;
  z-index: 8;
}
.sec09 {
  --base-h: 3510;
  z-index: 9;
}
.sec10 {
  z-index: 10;
}
/* 
//////////////////////////////////////////////////////////////////////////////////////////
common settings
//////////////////////////////////////////////////////////////////////////////////////////
*/
#FU260114mixmatch {
  --font-jp: 游ゴシック体, 游ゴシック Medium, Yu Gothic Medium, Yu Gothic,
    YuGothic, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  --font-en: novantique-script, sans-serif;
  --font-credit: stilson, serif;
  --font-regular: 400;
  --font-medium: 500;
  --font-bold: 700;
  --light-blue: #e8edf6;
  --sky-blue: #8ea7d0;
  --dark-gray: #333333;
  --red: #d74645;
  --white: #ffffff;
  --pink: #e7abbb;
  --gray: #999999;
  --pale-blue: #edf3fb;
  --blue: #79a9d6;
  --charcoal-gray: #666666;
  --snow-blue: #efeffe;
  font-feature-settings: "palt";
  position: relative;
  display: flex;
  background: var(--light-blue);
  margin: 0 0 calc(160 * var(--formula)) 0;
}
#FU260114mixmatch .no-link {
  cursor: default;
}
#FU260114mixmatch .no-link:hover {
  opacity: 1;
}

#FU260114mixmatch .lp-left-area,
#FU260114mixmatch .lp-right-area {
  position: sticky;
  flex: 1;
  top: var(--lpHeaderHeight);
  height: calc(100vh - var(--lpHeaderHeight));
}
#FU260114mixmatch .sec-set {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#FU260114mixmatch [class*="__one-credit"] {
  font-family: var(--font-credit);
  color: var(--dark-gray);
  font-size: calc(30 * var(--formula));
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  font-weight: var(--font-regular);
}
#FU260114mixmatch [class*="__h3"] {
  font-family: var(--font-en);
  line-height: 1;
  letter-spacing: 0.025em;
  text-align: center;
  font-weight: var(--font-bold);
}

#FU260114mixmatch [class*="__h3--md"] {
  font-size: calc(58 * var(--formula));
  color: var(--sky-blue);
}
#FU260114mixmatch [class*="__h3--lg"] {
  font-size: calc(76 * var(--formula));
}
#FU260114mixmatch [class*="__txt"] {
  font-size: calc(34 * var(--formula));
  font-family: var(--font-en);
  line-height: 1.6;
  letter-spacing: 0.025em;
  text-align: center;
  font-weight: var(--font-bold);
}
#FU260114mixmatch [class*="__credit"] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(0 * var(--formula));
}
#FU260114mixmatch [class*="__credit"] li {
  display: flex;
  gap: calc(18 * var(--formula));
}
#FU260114mixmatch [class*="__credit"] a {
  font-family: var(--font-credit);
  font-size: calc(22 * var(--formula));
  line-height: 1.8;
  letter-spacing: 0.05em;
  text-align: center;
  font-weight: var(--font-regular);
}
#FU260114mixmatch [class*="__slide-txt"] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(17 * var(--formula));
}

#FU260114mixmatch [class*="__slide-txt"] a {
  font-size: calc(22 * var(--formula));
  font-family: var(--font-credit);
  letter-spacing: 0.05em;
  font-weight: var(--font-regular);
  color: var(--sky-blue);
  line-height: 1.2;
  text-align: center;
}
#FU260114mixmatch [class*="-obj-01"] {
  position: absolute;
}

#FU260114mixmatch [class*="__h-cont"] {
  position: relative;
}
#FU260114mixmatch [class*="-img-"] {
  background: var(--white);
}

#FU260114mixmatch .sec05__img-cont,
#FU260114mixmatch .sec07__img-cont {
  position: relative;
}

#FU260114mixmatch .sec06__img-cont,
#FU260114mixmatch .sec08__img-cont,
#FU260114mixmatch .sec10__img-cont {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(10 * var(--formula));
  margin: calc(62 * var(--formula)) 0 calc(93 * var(--formula)) 0;
}
#FU260114mixmatch .lp-left-area {
  display: flex;
  flex-direction: column;
  gap: calc(36 * (100vw / 1400));
}

#FU260114mixmatch .lp-pc-cont {
  margin: calc(81 * var(--formula_pc)) 0 0 calc(128 * var(--formula));
  display: flex;
  flex-direction: column;
  gap: calc(36 * (100vw / 1400));
}
#FU260114mixmatch .lp-pc-01 {
  width: calc(172 * (100vw / 1400));
}

#FU260114mixmatch .lp-pc__txt {
  font-family: var(--font-jp);
  color: var(--dark-gray);
  font-size: calc(13 * (100vw / 1400));
  line-height: 2;
  letter-spacing: 0.075em;
  text-align: left;
  font-weight: var(--font-medium);
}

#FU260114mixmatch .lp-main-cont {
  position: relative;
  display: flex;
  flex-direction: column;
  width: calc(460 * var(--formula_pc));
  background: var(--white);
  overflow-x: clip;
}

#FU260114mixmatch .lp-mv-01 {
  width: calc(750 * var(--formula));
}

#FU260114mixmatch .sec01 {
  padding: calc(96 * var(--formula)) 0 calc(55 * var(--formula)) 0;
  border-bottom-width: max(1px, calc(2 * var(--formula)));
  border-style: dashed;
  border-color: var(--sky-blue);
}

#FU260114mixmatch .sec01__one-credit {
  margin: calc(44 * var(--formula)) 0 calc(45 * var(--formula)) 0;
}

#FU260114mixmatch .splide {
  width: 100%;
}

#FU260114mixmatch #sec01-slider .splide__slide {
  width: calc(200 * var(--formula));
}

#FU260114mixmatch .sec02 {
  padding: calc(74 * var(--formula)) 0 calc(57 * var(--formula)) 0;
  border-bottom-width: calc(2 * var(--formula));
  border-style: dashed;
  border-color: var(--sky-blue);
}

#FU260114mixmatch .sec02__one-credit {
  margin: calc(46 * var(--formula)) 0 calc(43 * var(--formula)) 0;
}
#FU260114mixmatch #sec02-slider .splide__slide {
  width: calc(180 * var(--formula));
}

#FU260114mixmatch .sec2__slide-txt {
  width: calc(180 * var(--formula));
  display: flex;
  flex-direction: column;
  align-items: center;
}

#FU260114mixmatch .sec03 {
  padding: calc(74 * var(--formula)) 0 calc(52 * var(--formula)) 0;
  border-bottom-width: max(1px, calc(2 * var(--formula)));
  border-style: dashed;
  border-color: var(--sky-blue);
}

#FU260114mixmatch .sec03__one-credit {
  margin: calc(45 * var(--formula)) 0 calc(44 * var(--formula)) 0;
}

#FU260114mixmatch .sec03__img-cont {
  display: flex;
  gap: calc(20 * var(--formula));
}

#FU260114mixmatch .sec3-img-01 {
  width: calc(180 * var(--formula));
}

#FU260114mixmatch .sec3-img-02 {
  width: calc(180 * var(--formula));
}

#FU260114mixmatch .sec3-img-03 {
  width: calc(180 * var(--formula));
}

#FU260114mixmatch .sec03__txt {
  font-size: calc(28 * var(--formula));
  font-family: var(--font-credit);
  letter-spacing: 0.05em;
  font-weight: var(--font-regular);
  color: var(--sky-blue);
  margin: calc(52 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec04 {
  padding: calc(75 * var(--formula)) 0 calc(123 * var(--formula)) 0;
}

#FU260114mixmatch .sec04__one-credit {
  margin: calc(45 * var(--formula)) 0 calc(45 * var(--formula)) 0;
}

#FU260114mixmatch #sec04-slider .splide__slide {
  width: calc(180 * var(--formula));
}

#FU260114mixmatch .sec04__teaset-txt-cont {
  font-family: var(--font-jp);
  color: var(--dark-gray);
  font-size: calc(24 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.05em;
  text-align: center;
  font-weight: var(--font-medium);
  margin: calc(117 * var(--formula)) 0 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(73 * var(--formula));
}

#FU260114mixmatch .sec05 {
  background: var(--red);
  color: var(--white);
  padding: calc(114 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec5-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(56 * var(--formula)) 0 calc(77 * var(--formula)) 0;
}

#FU260114mixmatch .sec05__img-cont {
  margin: calc(62 * var(--formula)) 0 calc(92 * var(--formula)) 0;
  height: calc(1140 * var(--formula));
  width: 100%;
}

#FU260114mixmatch .sec5-img-02 {
  width: calc(420 * var(--formula));
  position: absolute;
  right: calc(40 * var(--formula));
  top: 0;
  z-index: 1;
}

#FU260114mixmatch .sec5-img-03 {
  width: calc(450 * var(--formula));
  position: absolute;
  top: calc(180 * var(--formula));
  left: calc(40 * var(--formula));
  z-index: 2;
}

#FU260114mixmatch .sec5-img-04 {
  width: calc(540 * var(--formula));
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 3;
}

#FU260114mixmatch .sec06 {
  background: var(--pink);
  color: var(--white);
  padding: calc(175 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec6-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(55 * var(--formula)) 0 calc(77 * var(--formula)) 0;
}

#FU260114mixmatch .sec6-img-02 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec6-img-03 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec6-img-04 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec6-img-05 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec07 {
  background: var(--white);
  color: var(--gray);
  padding: calc(175 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec7__h3-space {
  margin-left: calc(61 * var(--formula));
}
#FU260114mixmatch .sec7-obj-01 {
  width: calc(25 * var(--formula));
  top: calc(30 * var(--formula));
  left: calc(280 * var(--formula));
}

#FU260114mixmatch .sec7-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(55 * var(--formula)) 0 calc(77 * var(--formula)) 0;
}

#FU260114mixmatch .sec07__img-cont {
  width: 100%;
  height: calc(1280 * var(--formula));
  margin: calc(62 * var(--formula)) 0 calc(93 * var(--formula)) 0;
}

#FU260114mixmatch .sec7-img-02 {
  width: calc(510 * var(--formula));
  position: absolute;
  top: 0;
  left: calc(40 * var(--formula));
  z-index: 1;
}

#FU260114mixmatch .sec7-img-03 {
  width: calc(480 * var(--formula));
  position: absolute;
  top: calc(240 * var(--formula));
  right: 0;
  z-index: 2;
}

#FU260114mixmatch .sec7-img-04 {
  width: calc(540 * var(--formula));
  position: absolute;
  bottom: 0;
  margin: auto;
  z-index: 3;
  left: 0;
  right: 0;
}

#FU260114mixmatch .sec08 {
  background: var(--pale-blue);
  color: var(--blue);
  padding: calc(174 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec8-obj-01 {
  width: calc(25 * var(--formula));
  top: calc(32 * var(--formula));
  right: calc(292 * var(--formula));
}

#FU260114mixmatch .sec8-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(57 * var(--formula)) 0 calc(78 * var(--formula)) 0;
}

#FU260114mixmatch .sec08__img-cont {
  margin: calc(61 * var(--formula)) 0 calc(93 * var(--formula)) 0;
}

#FU260114mixmatch .sec8-img-02 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec8-img-03 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec8-img-04 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec8-img-05 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec8-img-06 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec8-img-07 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec09 {
  background: var(--dark-gray);
  color: var(--white);
  padding: calc(175 * var(--formula)) 0 0 0;
}

#FU260114mixmatch .sec9-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(55 * var(--formula)) 0 calc(77 * var(--formula)) 0;
}

#FU260114mixmatch .sec09__img-cont {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(30 * var(--formula));
  margin: calc(82 * var(--formula)) 0 calc(73 * var(--formula)) 0;
}

#FU260114mixmatch .sec9-img-02 {
  width: calc(600 * var(--formula));
}

#FU260114mixmatch .sec9-img-03 {
  width: calc(600 * var(--formula));
}

#FU260114mixmatch .sec10 {
  background: var(--snow-blue);
  color: var(--charcoal-gray);
  padding: calc(174 * var(--formula)) 0 calc(220 * var(--formula)) 0;
}

#FU260114mixmatch .sec10-obj-01 {
  width: calc(25 * var(--formula));
  top: calc(32 * var(--formula));
  left: calc(296 * var(--formula));
}

#FU260114mixmatch .sec10-img-01 {
  width: calc(750 * var(--formula));
  margin: calc(56 * var(--formula)) 0 calc(77 * var(--formula)) 0;
}

#FU260114mixmatch .sec10__img-cont {
  margin: calc(62 * var(--formula)) 0 calc(92 * var(--formula)) 0;
}
#FU260114mixmatch .sec10__img-cont2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: calc(195 * var(--formula)) 0 0 0;
}
#FU260114mixmatch .sec10-img-02 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec10-img-03 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec10-img-04 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec10-img-05 {
  width: calc(330 * var(--formula));
}

#FU260114mixmatch .sec10__obj-cont {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(20 * var(--formula));
}

#FU260114mixmatch .sec10-obj-02 {
  width: calc(30 * var(--formula));
}

#FU260114mixmatch .sec10__staff-credit {
  font-family: var(--font-credit);
  font-size: calc(24 * var(--formula));
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: center;
  font-weight: var(--font-regular);
  margin: calc(80 * var(--formula)) 0 calc(82 * var(--formula)) 0;
  display: flex;
  flex-direction: column;
  gap: calc(24 * var(--formula));
}

#FU260114mixmatch .sec10-obj-03 {
  width: calc(600 * var(--formula));
}

#FU260114mixmatch .sec10-img-06 {
  width: calc(480 * var(--formula));
  margin: calc(180 * var(--formula)) 0 0 0;
  background: unset;
}

#FU260114mixmatch .lp-right-area {
  justify-items: center;
  align-items: end;
  display: grid;
}

#FU260114mixmatch .lp-pc-02 {
  width: calc(260 * (100vw / 1400));
  margin: 0 0 calc(40 * (100vw / 1400)) 0;
}

@media (max-width: 767px) {
  #FU260114mixmatch .lp-left-area,
  #FU260114mixmatch .lp-right-area {
    display: none;
  }
  #FU260114mixmatch .lp-main-cont {
    width: 100%;
  }
}