/* =========================================================
   ベーススタイル・ユーティリティ
========================================================= */
.mindmeditation_main {
  color: #211815;
  background: #fff;
  overflow: clip !important;
  position: relative;
  z-index: 1;
}
.mindmeditation_main * {
  font-feature-settings: "palt";
}

@media screen and (max-width: 900px) {
  .mindmeditation_main .isPc { display: none !important; }
}
@media screen and (min-width: 901px) {
  .mindmeditation_main .isSp { display: none !important; }
}

.mindmeditation_main .main_width {
  display: block;
  margin: 0 auto;
  max-width: 994px;
  padding: 0 28px;
}
@media screen and (max-width: 900px) {
  .mindmeditation_main .main_width { padding: 0 7.467vw; }
}

/* 共通：h2 spanの強制リセット (base.css対策) */
.mindmeditation_main h2 span,
.mindmeditation_main p span {
    font-size: inherit !important;
    line-height: inherit !important;
}

/* =========================================================
   スクロールアニメーション初期設定
========================================================= */
.mindmeditation_main .change-text4 {
  opacity: 0.1;
  transition: 1.5s;
}
.mindmeditation_main .scroll_anime_2 {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.mindmeditation_main .scroll_anime_2.show {
  opacity: 1;
  transform: translateY(0);
}

/* =========================================================
   KV Sticky エリア
========================================================= */
.mindmeditation_main .sticky_wrap .first { position: sticky; top: 0; z-index: 1; }
.mindmeditation_main .sticky_wrap .first .kv { position: relative; z-index: 1; }
.mindmeditation_main .sticky_wrap .first .kv img { width: 100%; height: auto; display: block; }

.mindmeditation_main .sticky_wrap .second {
  position: sticky; top: 104px; z-index: 1;
}
@media screen and (max-width: 900px) {
  .mindmeditation_main .sticky_wrap .second { top: 45px; }
}

.mindmeditation_main .sticky_wrap .second .kv {
  position: relative; z-index: 1; height: calc(100vh - 104px);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
@media screen and (max-width: 900px) {
  .mindmeditation_main .sticky_wrap .second .kv { height: calc(100vh - 44px); }
}

.mindmeditation_main .sticky_wrap .txt { pointer-events: none; position: relative; z-index: 2; }
.mindmeditation_main .sticky_wrap .txt .text h2.ttl {
  font-size: 20px; color: #211815; line-height: 1.75; text-align: center; letter-spacing: 0.1em; margin-bottom: 2em; font-weight: normal;
}
.mindmeditation_main .sticky_wrap .txt .text p.desc {
  font-size: 15px; color: #211815; line-height: 1.6; text-align: center; letter-spacing: 0.1em; margin: 0;
}
.mindmeditation_main .sticky_wrap .txt .text p.desc + p.desc { margin-top: 2em; }

@media screen and (max-width: 900px) {
  .mindmeditation_main .sticky_wrap .txt .text { padding: 26.667vw 7.467vw; }
  .mindmeditation_main .sticky_wrap .txt .text h2.ttl { font-size: 5.067vw; line-height: 1.65; }
  .mindmeditation_main .sticky_wrap .txt .text p.desc { font-size: 3.467vw; line-height: 1.65; }
}

.mindmeditation_main .sticky_wrap .kara { height: 100vh; }

/* =========================================================
   Approach (3つのアプローチ)
========================================================= */
.mindmeditation_main .approach { position: relative; z-index: 1; padding: 90px 0; background: url(/img/usr/freepage/mindmeditation/approach_bg.jpg) top center/cover no-repeat; }
.mindmeditation_main .approach .area_ttl { font-size: 19px; line-height: 1.65; text-align: center; letter-spacing: 0.1em; margin-bottom: 70px; font-weight: normal;}
.mindmeditation_main .approach .inner .list { position: relative; z-index: 1; }

.mindmeditation_main .approach .approach_01 { position: absolute; width: 340px; left: -280px; bottom: 170px; }
.mindmeditation_main .approach .approach_02 { position: absolute; width: 340px; top: -110px; right: -190px; }
.mindmeditation_main .approach img { width: 100%; height: auto; }

.mindmeditation_main .approach .set { position: relative; margin-bottom: 60px; }
.mindmeditation_main .approach .set .number {
  background: #9b8172; opacity: 0.9; width: 68px; height: 68px; border-radius: 100%;
  position: absolute; top: -34px; left: -34px; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 5;
}
.mindmeditation_main .approach .set .number .p { font-size: 10px; color: #F5F5F5; display: block; }
.mindmeditation_main .approach .set .number .n { font-size: 25px; color: #F8F8F8; display: block; }

.mindmeditation_main .approach .set .set_inner { background: rgba(255, 254, 253, 0.5); padding: 45px 90px; }
.mindmeditation_main .approach .set .txt h3.ttl { font-size: 18px; border-bottom: 1px #83786E solid; padding-bottom: 1em; margin-bottom: 1em; text-align: center; font-weight: normal;}
.mindmeditation_main .approach .set .txt h4.ttl { font-size: 16px; margin-bottom: 1em; text-align: center; font-weight: normal;}
.mindmeditation_main .approach .set .txt p.desc { font-size: 14px; text-align: center; margin-bottom: 1em; }
.mindmeditation_main .approach .set .txt p.notes { font-size: 10px; text-align: center; }

/* 2つの香り */
.mindmeditation_main .approach .imgtxt { margin-top: 26px; }
.mindmeditation_main .approach .imgtxt h4.ttl { font-size: 15px; text-align: center; margin-bottom: 20px; }
.mindmeditation_main .approach .imgtxt h4.ttl span { display: inline-block; background: rgba(255, 255, 255, 0.5); padding: 0.2em 2em; }
.mindmeditation_main .approach .photo_col { display: flex; margin: 0 -13px; }
.mindmeditation_main .approach .photo { width: 50%; padding: 0 13px; }
.mindmeditation_main .approach .photo .img { margin-bottom: 16px; }
.mindmeditation_main .approach .photo h4.name { font-size: 14px; margin-bottom: 0.5em; font-weight: normal;}
.mindmeditation_main .approach .photo p.desc { font-size: 13px; text-align: justify; margin: 0; line-height: 1.6;}

@media screen and (max-width: 900px) {
  .mindmeditation_main .approach { padding: 22.667vw 0 14.4vw; }
  .mindmeditation_main .approach .area_ttl { font-size: 4.8vw; margin-bottom: 14.933vw; }
  .mindmeditation_main .approach .approach_01, .mindmeditation_main .approach .approach_02 { display: none; }
  .mindmeditation_main .approach .set .number { width: 16.533vw; height: 16.533vw; top: -10.667vw; left: -3.2vw; }
  .mindmeditation_main .approach .set .set_inner { padding: 8vw 6.4vw; }
  .mindmeditation_main .approach .set .txt h3.ttl { font-size: 4.267vw; }
  .mindmeditation_main .approach .set .txt h4.ttl { font-size: 3.733vw; }
  .mindmeditation_main .approach .set .txt p.desc { font-size: 3.2vw; text-align: justify; }
  .mindmeditation_main .approach .photo_col { display: block; margin: 0; }
  .mindmeditation_main .approach .photo { width: auto; padding: 0; margin-bottom: 8vw; }
  .mindmeditation_main .approach .photo h4.name { font-size: 3.733vw; }
  .mindmeditation_main .approach .photo p.desc { font-size: 3.2vw; }
}

/* =========================================================
   Common Ingredients (共通成分)
========================================================= */
.mindmeditation_main .common { background: #D9D0C6; padding: 85px 0 52px; }
.mindmeditation_main .common .inner .list { max-width: 600px; margin: 50px auto 0; }
.mindmeditation_main .common .block { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -25px; }
.mindmeditation_main .common .set { width: 25%; padding: 0 25px; margin-bottom: 37px; box-sizing: border-box;}
.mindmeditation_main .common .set img { width: 100%; height: auto; display: block; }
.mindmeditation_main .common .set .txt { margin-top: 15px; }
.mindmeditation_main .common .set .name { font-size: 12px; text-align: center; line-height: 1.25; margin: 0;}
.mindmeditation_main .common .notes { font-size: 10px; text-align: center; margin-top: 50px; }

@media screen and (max-width: 900px) {
  .mindmeditation_main .common { padding: 20vw 0; }
  .mindmeditation_main .common .block { margin: 0 -3.467vw; }
  .mindmeditation_main .common .set { width: 33.333%; padding: 0 3.467vw; margin-bottom: 8.533vw; }
  .mindmeditation_main .common .set .name { font-size: 3.2vw; }
  .mindmeditation_main .common .notes { font-size: 2.667vw; text-align: justify; margin-top: 10.133vw; }
}

/* =========================================================
   Lineup (商品詳細)
========================================================= */
.mindmeditation_main .lineup { background: #F5F5F5; padding: 90px 0 180px; }
.mindmeditation_main .lineup .product { margin-top: 64px; }
.mindmeditation_main .lineup .product + .product { margin-top: 176px; }
.mindmeditation_main .lineup .product_ttl {
  font-size: 15px; letter-spacing: 0.1em; border-bottom: 1px solid #707070; padding-bottom: 0.5em; margin-bottom: 28px; font-weight: normal; text-transform: uppercase;
}
.mindmeditation_main .lineup .main_img { margin-bottom: 50px; }
.mindmeditation_main .lineup .main_img img { width: 100%; height: auto; display: block; }

.mindmeditation_main .lineup .info { margin-bottom: 68px; text-align: center; }
.mindmeditation_main .lineup .info .name { font-size: 20px; margin-bottom: 0.5em; font-weight: normal;}
.mindmeditation_main .lineup .info .price { font-size: 14px; margin: 0; }

.mindmeditation_main .lineup .circle_list { margin: 18px 0 55px; }
.mindmeditation_main .lineup .circle_list ul { display: flex; justify-content: center; flex-wrap: wrap; padding: 0; list-style: none; margin: 0 -2px; }
.mindmeditation_main .lineup .circle_list li { padding: 0 2px; margin-bottom: 10px; }
.mindmeditation_main .lineup .circle_list span { border: 1px #211815 solid; border-radius: 100vh; padding: 0.1em 0.5em 0; font-size: 11px; display: inline-block; }

.mindmeditation_main .lineup .info .catch { font-size: 17px; color: #9B8172; margin-bottom: 1em; font-weight: normal;}
.mindmeditation_main .lineup .info .desc { font-size: 13px; text-align: justify; line-height: 1.65; max-width: 560px; margin: 0 auto; display: block; }

/* ボタンコンポーネント */
.mindmeditation_main .conductor { margin-top: 100px; }
.mindmeditation_main .conductor .block { display: flex; max-width: 772px; margin: 0 auto; }
.mindmeditation_main .conductor .set { width: 50%; padding: 0 10px; box-sizing: border-box; }
.mindmeditation_main .conductor img { width: 100%; height: auto; display: block; }
.mindmeditation_main .conductor .name { font-size: 14px; text-align: center; margin: 0 0 30px; font-weight: normal;}

.mindmeditation_main .btn { width: 100%; max-width: 270px; margin: 0 auto; }
.mindmeditation_main .btn > a {
  background: #9B8172; color: #fff; text-align: center; display: block; padding: 14px 1em; text-decoration: none; font-size: 14px; transition: 0.5s;
}
.mindmeditation_main .btn > a:hover { opacity: 0.8; }
.mindmeditation_main .btn.link > a::after {
  content: "→"; margin-left: 10px; font-family: "Hiragino Kaku Gothic ProN", sans-serif;
}

@media screen and (max-width: 900px) {
  .mindmeditation_main .lineup { padding: 24vw 0 26.667vw; }
  .mindmeditation_main .lineup .product + .product { margin-top: 18.667vw; }
  .mindmeditation_main .lineup .product_ttl { font-size: 4vw; margin-bottom: 8vw; }
  .mindmeditation_main .lineup .main_img { margin: 0 -7.467vw 13.333vw; }
  .mindmeditation_main .lineup .info .name { font-size: 4.533vw; }
  .mindmeditation_main .lineup .info .price { font-size: 3.467vw; }
  .mindmeditation_main .lineup .info .catch { font-size: 4vw; }
  .mindmeditation_main .lineup .info .desc { font-size: 3.467vw; }
  .mindmeditation_main .conductor { margin-top: 10.667vw; }
  .mindmeditation_main .conductor .block { display: block; }
  .mindmeditation_main .conductor .set { width: auto; margin-bottom: 13.333vw; }
  .mindmeditation_main .btn > a { font-size: 3.733vw; padding: 2.667vw 1em; }
}

/* =========================================================
   2つ目のスクロールエリア背景の修正
========================================================= */
/* 背景画像を強制的に表示させる */
.mindmeditation_main .sticky_wrap .second .kv::after {
    content: "" !important; /* noneを解除 */
    background-image: url(/img/usr/freepage/mindmeditation/second_pc.jpg) !important;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
}

/* スマホ版の背景画像切り替え */
@media screen and (max-width: 900px) {
    .mindmeditation_main .sticky_wrap .second .kv::after {
        background-image: url(/img/usr/freepage/mindmeditation/second_sp.jpg) !important;
    }
}

/* テキストエリアが透けないように調整 */
.mindmeditation_main .sticky_wrap .second .kv {
    background-color: transparent; /* 背景画像を見せる */
}

/* 前回のパンくず対策CSSとの干渉を防ぐ（念のため追加） */
.pane-main {
    background-color: transparent !important;
}

/* POINTの数字を中央に配置 */
.mindmeditation_main .approach .set .number {
    left: 50% !important;
    transform: translateX(-50%) !important;
}

/* 復活させた特徴ボックス（pointセクション）の余白調整 */
.mindmeditation_main .lineup .inner .product .point {
    margin-bottom: 60px;
}
@media screen and (max-width: 900px) {
    .mindmeditation_main .lineup .inner .product .point {
        margin-bottom: 12vw;
    }
}