.pc-only {
  display: block;
}
.sp-only {
  display: none;
}

@media only screen and (max-width: 640px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }
}


.special-skimen-bg {
    background-repeat: no-repeat;
    /* background-position: center center; */
    background-position: center right;
    background-size: cover;   
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/250718_img01_bg2.png);
}

@media only screen and (max-width: 640px) {
.special-skimen-bg {
    background-position: top center;  
    background-size: 100% auto;
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/250718_img01_bg_sp.png);
  }
}


.special-skimen-bg2 {
    background-repeat: no-repeat;
    /* background-position: center center; */
    background-position: center;
    background-size: cover;   
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/250718_img02_bg5.jpg);
}

@media only screen and (max-width: 640px) {
.special-skimen-bg2 {
    background-position: top center;  
    background-size: cover;
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/250718_img02_bg5.jpg);
  }
}

.special-skimen-bg3 {
    background-repeat: no-repeat;
    background-position: center top;
    /* background-position: center right; */
    background-size: cover;   
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_01_bg_pc.png);
}

@media only screen and (max-width: 640px) {
.special-skimen-bg3 {
background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_01_bg_sp.png);
        background-position: center top; 
        background-size: cover; 
        background-repeat: no-repeat;
  }
}

.special-skimen-bg4 {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_02_bg_pc.png);
}

/* @media only screen and (max-width: 640px) {
.special-skimen-bg4 {
background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_02_bg_sp.png);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  }
} */

@media only screen and (max-width: 640px) {
    .special-skimen-bg4 {
        position: relative;
        /* 背景を表示する範囲をこのセクション内に限定する */
        clip-path: inset(0); 
        z-index: 0;
        /* 元の背景指定をリセット */
        background: none !important;
        /* 高さが足りない場合に備えて最小高さを指定（必要に応じて） */
        min-height: 100vh; 
    }

    .special-skimen-bg4::before {
        content: "";
        display: block;
        position: fixed; /* 画面に対して固定 */
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_02_bg_sp.png);
        background-size: cover;
        background-position: center;
        /* iPhoneでの挙動を安定させるため */
        will-change: transform; 
    }
}







.special-skimen-bg5 {
    background-repeat: no-repeat;
    background-position: center bottom;
    /* background-position: center right; */
    background-size: cover;   
    background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_03_bg_pc.png);
}

@media only screen and (max-width: 640px) {
.special-skimen-bg5 {
background-image: url(/content/dam/sites/kanebo/www-lissage-jp/special/skimen/2605_03_bg_sp.png);
        background-position: center bottom; 
        background-size: cover; 
        background-repeat: no-repeat;
  }
}




/* 親コンテナ */
.img-fade-area {
  width: 100%;
  position: relative;
  line-height: 0;
  overflow: hidden;
}

/* PC/SP切り替え */
.pc-only { display: block !important; }
.sp-only { display: none !important; }
@media only screen and (max-width: 640px) {
  .pc-only { display: none !important; }
  .sp-only { display: block !important; }
}

/* 画像の共通設定 */
.img-fade-area .fade-img {
  width: 100%;
  height: auto;
  opacity: 0;
  transform: scale(0.95); /* ズーム開始サイズ */
  transition: opacity 1.2s ease, transform 1.2s ease-out;
  pointer-events: none;
  display: block;
  /* z-indexを効かせるために一旦すべてabsoluteにする */
  position: absolute;
  top: 0;
  left: 0;
}

/* 土台画像（01, 07）の設定 */
.img-fade-area .fade-img.base-layer {
  /* 土台は浮かさず、地面に置くことで親の「高さ」を作る */
  position: relative; 
  /* 土台にはズームをかけない */
  transform: none !important;
}

/* アニメーション発火用クラス */
.img-fade-area .fade-img.visible {
  opacity: 1;
  transform: scale(1); /* 100%のサイズへ */
}
}












.narrow-div::before {
  content: '';
  position: fixed;
  top: 0; 
  /* left: -200%; */
  width: 100%;
  height: 100%;
  background: #0e075b;
  z-index: -1;
  pointer-events: none; /* 背景だけなのでクリックを通す */
}

@media (min-width: 641px) and (max-width: 1024px) {
.narrow-div::before {
    content: '';
    position: fixed;
    top: 0; 
    /* left: -201%; */
    width: 100%;
    height: 100%;
    background: #0e075b;
    z-index: -1;
    pointer-events: none; /* 背景だけなのでクリックを通す */
  }
} 

@media only screen and (max-width: 640px) {
.narrow-div::before {
    content: '';
    position: fixed;
    top: 0; 
    /* left: -100%; */
    width: 100%;
    height: 100%;
    background: #0e075b;
    z-index: -1;
    pointer-events: none; /* 背景だけなのでクリックを通す */
  }
} 

/*
.narrow .g-Column__inner .g-Column__cols {
  padding: 0;
}
*/


.narrow .l-Column__cols {
  padding: 0;
}

.narrow.l-Column.is-gutter--m .l-Column__cols {
  padding: 0;
}

@media only screen and (min-width: 641px) {
  .sample_coupon_banner{
    float: right;
  }
}

.koneko .l-AccordionUnit__titleBlock {
    border-color: #0e085b;
    background-color: #0e085b;
    font-family: "NotoSansCJKjp-Light";
}

.koneko .l-AccordionUnit__titleBlock .l-HeadingTitle:not(.is-link) .l-HeadingTitle__h3 {
    color: #ffffff;
}

.koneko .l-AccordionUnit__contentBlock {
    border: none;
}

.koneko .l-AccordionUnit__titleBlock__icon {
    color: #ffffff;
}

@media only screen and (max-width: 640px) {
  .koneko .l-AccordionUnit__titleBlock .l-HeadingTitle:not(.is-link) .l-HeadingTitle__h3 {
    font-size: 14px;
  }
}

