@charset "UTF-8";


@media screen and (max-width:767px) {
  :root {
    --formula: (100vw / 750);
    /*
    --lpHeaderHeight: 35.4062px;
    --lpHeadBannerHeight: 50px;
    */
  }
  
  .main-area{
    overflow: inherit;
  }
  
  .main-area .main-inner{
    width: 100%;
  }
  
}

.main-area{
  overflow-x: clip;
}

:root{
  --scrollbarSize: 0;
}



/*******************************
LB250905candystock
*******************************/
#LB250905candystock{
  --color-bg-navy: #1b192d;
  --color-white: #f7efe6;
  --font-neue: "neue-haas-grotesk-display", sans-serif;
  --font-winsel: "winsel-variable", sans-serif;
  --font-source: "source-han-sans-japanese", sans-serif;

  /*デザインの値*/
  --pc-width: 1280;/*PCデザイン幅*/
  --sp-width: 750;/*SPデザイン幅*/
  --pc-artboard-width: 480.7085;/*SP共通デザイン幅*/
  --sp-artboard-width: 750;/*PC共通デザイン幅*/
 /*可変率の計算式*/
  --formula: calc(var(--variable) * var(--ratio));/*SP,PC共通箇所の可変割合の計算式*/
  --formula_pc: calc(var(--variable) * 1);/*PCデザインの可変割合の計算式*/

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;

  font-weight: var(--fw-regular);
  font-style: normal;
  display: block;
  width: 100%;
  box-sizing: border-box;
  background-color: var(--color-bg-navy);
}

/* ▼ -----------可変設定---------- ▼ */
/* PC画面幅 1400px以上 固定 */


 /* PC画面幅 768～1400px 可変 */
 @media (min-width: 768px){
  #LB250905candystock {
  --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比率 */
  --variable: calc(100vw / var(--pc-width)); /* 画面幅に基づく可変値 */
  }
 }

 /* SP画面幅 767px以下 可変 */
 @media (max-width: 767px) {
  #LB250905candystock {
  --ratio: 1; /* 比率は1（変わらない） */
  --variable: calc(100vw / var(--sp-width)); /* 画面幅に基づく可変値 */
  }
 }
/* ▲ -----------可変設定---------- ▲ */

/* Source Han Sans JP Medium
font-family: "source-han-sans-japanese", sans-serif;

Neue Haas Grotesk Display Pro 45 Light
font-family: "neue-haas-grotesk-display", sans-serif;

font-family: "winsel-variable", sans-serif;
font-variation-settings: "wdth" 1, "wght" 100;
*/

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

}

@media (min-width: 768px) and (max-width: 2100px) {
  #LB250905candystock {
    --ratio: 1;
    --variable: calc(100vw / var(--sp-width));
  }
} */

@media screen and (max-width: 767px) {

  #LB250905candystock .hidden-small {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  #LB250905candystock .hidden-large {
    display: none !important;
  }
}

#LB250905candystock *{box-sizing: border-box;}

@media (hover: hover) {
  #LB250905candystock a:hover{
    opacity: .6;
  }
}

@media (hover: none) {
  #LB250905candystock a:hover{
    opacity: 1;
  }
}

/*******************************
img setting
*******************************/
#LB250905candystock img,
#LB250905candystock picture{
  display: block;
  width: 100%;
  height: auto;
}

.imgOuter{
  display: block;
  height: auto;
}

/* #LB250905candystock .imgOuter > a{
  display: block;
  width: 100%;
  height: auto;
  pointer-events: auto;
} */


/*******************************
creditLinks
*******************************/
/* overCredit **********/
#LB250905candystock .product-caption-tag{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: calc(470 * var(--formula));
  gap: calc(6 * var(--formula)) calc(5 * var(--formula));
  padding: calc(37 * var(--formula)) 0 calc(32 * var(--formula));
}


#detail10 .product-caption-tag{
  width: calc(350 * var(--formula));
}

#LB250905candystock .product-caption-tag a{
  display: inline;
  font-family: var(--font-winsel);
  font-size: calc(23 * var(--formula));
  letter-spacing: 0.014em;
  word-spacing: calc(1.5 * var(--formula));
  line-height: 1;
  font-weight: var(--fw-light);
  font-variation-settings: "wdth" 1, "wght" 100;
  color: #20192d;
}

/*******************************
lpWrap
*******************************/
#LB250905candystock .lpWrap{
  width: 100%;
  margin-bottom: calc(200 * var(--formula));
  z-index: 1;
}

#LB250905candystock #mvBlock{
  display: block;
  width: 100%;
  position: relative;
}

  
#LB250905candystock #mvBlock .mvInner{
  display: block;
  width: 100%;
}

#LB250905candystock #mvBlock .text_upper{
  position: absolute;
  top: calc(43 * var(--formula));
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  pointer-events: none;
}

#LB250905candystock #mvBlock .text_upper .textInner{
  width: calc(280 * var(--formula));
}

#LB250905candystock #mvBlock .text_bottom{
  position: absolute;
  bottom: calc(88 *  var(--formula));
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  pointer-events: none;
}

#LB250905candystock #mvBlock .text_bottom .textInner{
  width: calc(688.5967 *  var(--formula));
}

#LB250905candystock a{
  pointer-events: all;
}

@media screen and (min-width:768px){
  #LB250905candystock .lpWrap{
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    width: 100%;
    padding: 0;
  }

  #LB250905candystock .lpMain{
    position: relative;
    z-index: 10;
    width: 100%;
    margin: auto;
    overflow-x: clip;
    width: calc(750 * var(--formula));
    margin: 0 auto;
    grid-column: 2;
    z-index: 1;
    border-right: solid var(--color-white) 1px;
    border-left: solid var(--color-white) 1px;
  }

  #LB250905candystock .fixed_img--right,
  #LB250905candystock .fixed_img--left{
    position: sticky;
    display: grid;
    grid-column: 1;
    top: 0;
    height: 100vh;
    place-content: center;
    z-index: -1;
    pointer-events: none;
  }

  #LB250905candystock .fixed_img--left{
    grid-column: 1;
  }

  #LB250905candystock .fixed_img--right {
    grid-column: 3;
  }

  #LB250905candystock .fixed_img--right .txt_ttl--img{
    width: calc(59.2339 * (100vw /1280));
  }

  #LB250905candystock .fixed_img--left .txt_ttl--img{
    width: calc(89.939 * (100vw /1280));
  }

  /* #LB250905candystock .mv-img{
    position: relative;
    width: 100% !important;
    height: 100vh !important;
    display: inline-block !important;
    z-index: 1;
  } */
}

/*******************************
firstLede
*******************************/
#LB250905candystock .firstview{
  position: relative;
  width: 100%;
}

#LB250905candystock .firstview::after{
  content: "";
  position: absolute;
  bottom: calc(10 * var(--formula));
  right: calc(14.2534 * var(--formula));
  background-image: url(../img/SVG/under-lb.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: calc(154.5273 * var(--formula));
  height: calc(20.8599 * var(--formula));
}

#LB250905candystock .firstview::before{
  content: "";
  position: absolute;
  bottom: calc(10 * var(--formula));
  left: calc(10 * var(--formula));
  background-image: url(../img/SVG/under-ac.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: calc(120.4531 * var(--formula));
  height: calc(20.8599 * var(--formula));
}

#LB250905candystock .lead_txt{
  font-family: var(--font-source);
  font-family: var(--font-neue);
  font-size: calc(19 * var(--formula));
  line-height: 2.3626315789;
  letter-spacing: 0.038em;
  font-weight: var(--fw-medium);
  text-align: center;
  color: var(--color-white);
  padding: calc(60.5 * var(--formula)) 0 calc(84.7 * var(--formula));
}

/*******************************
modal list｜thumbnail
*******************************/
#LB250905candystock .thumb_image-list{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
}

#LB250905candystock .thumb_image-item{
  width: 33.3333333333%;
}

/*******************************
modal
*******************************/
body.is-not_scroll {
  overflow: hidden;
  height: 100%;
}

#LB250905candystock .lp_modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}

#LB250905candystock .lp_modal.is-open {
  opacity: 1;
  visibility: visible;
}

#LB250905candystock .lp_modal-overlay {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(73, 71, 87, 0.95);
  mix-blend-mode: multiply;
  z-index: 1;
}

#LB250905candystock .lp_modal-overlay.is-open {
  display: block;
}

/* #LB250905candystock .lp_overlay {
  position: absolute;
  z-index: -1;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(30, 30, 40, 0.86);
  mix-blend-mode: multiply;
} */

/* #LB250905candystock .lp_modal-overlay::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(30, 30, 40, 0.86);
  mix-blend-mode: multiply;
} */

#LB250905candystock .modal-content{
  position: relative;
  width: calc(680 * var(--formula));
  background-color: var(--color-white);
  padding: calc(68.7 * var(--formula)) 0 0 0;
  /* box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); */
  /* border-radius: 8px; */
  z-index: 100;
}

#LB250905candystock .product-image{
  position: relative;
  width: calc(530.8479 * var(--formula));
  z-index: 1;
  padding-top: calc(6.1763 * var(--formula));
}

#LB250905candystock .product-image::after{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  width: calc(543.2005 * var(--formula));
  height: calc(772.0143 * var(--formula));
  background-color: #0a090b;
}

#LB250905candystock .modal-content figure{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.close-btn{
  position: absolute;
  z-index: 10;
  opacity: 0;
}



/*******************************
.lpBottomArea
*******************************/

#LB250905candystock .lpBottomArea{
  width: calc(131.7725 * var(--formula));
  margin: calc(49 * var(--formula)) auto 0;
  padding-bottom: calc(45.9987 * var(--formula));
}

/*******************************
.main-slider
*******************************/

#LB250905candystock .swiper-button-next,
#LB250905candystock .swiper-button-prev{
  top: 46%;
  width: calc(12.9697 * var(--formula))!important;
  height: calc(22.6768 * var(--formula))!important;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: all;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
  right: 4%;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
  left: 4%;
}

#LB250905candystock .swiper-button-prev {
  background-image: url('../img/SVG/arrow_left.svg');
}

#LB250905candystock .swiper-button-next {
  background-image: url('../img/SVG/arrow_right.svg');
}

#LB250905candystock .swiper-button-prev::after,
#LB250905candystock .swiper-button-next::after {
  display: none;
}

#LB250905candystock .swiper-pagination-bullet{
  width: calc(6.7725 * var(--formula));
  height: calc(6.7725 * var(--formula));
  background: none;
  border: var(--color-white) solid 1px;
}

#LB250905candystock .swiper-pagination-bullet-active{
  background: var(--color-white);
  border: var(--color-white) solid 1px;
}

#LB250905candystock .swiper-horizontal>.swiper-pagination-bullets, 
#LB250905candystock .swiper-pagination-bullets.swiper-pagination-horizontal, 
#LB250905candystock .swiper-pagination-custom, .swiper-pagination-fraction{
  display: flex;
  bottom: 0;
  top: calc(12.473 * var(--formula));
  left: calc(10.473 * var(--formula));
  column-gap: calc(5 * var(--formula));
}

#LB250905candystock .swiper-pagination{
  align-items: left;
}