@charset "UTF-8";

/* =========================================================
  VERY 特集：エイジングケア（PC）  / agingcare.css
  - acne.css の「特集ページ共通」寄せ
  - 影響範囲： .special.agingcare 配下に限定
========================================================= */

/* ------------------------------
  Base (scope outside is minimal)
------------------------------ */
.special.agingcare,
.special.agingcare * {
  box-sizing: border-box;
}

.special.agingcare img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom
}

/* ------------------------------
  コンテナ
------------------------------ */
.special.agingcare {
  background-color: #ffffff;
  font-size: 13px;
  line-height: 1.8;
  color: #333333;
  padding-bottom: 60px;
}

/* ラッパー（acne.css に合わせて内側に .aging-inner を想定） */
.special.agingcare .aging-inner {
  padding: 0 40px 60px;
}

/* PC では本文幅を少し狭めて読みやすく */
.special.agingcare .aging-inner {
  max-width: 800px;
  margin: 0 auto;
}

/* ------------------------------
  特集メニュー（グローバルの .specialMenu を上書き）

.specialMenu {
  margin: 20px 0 30px;
  text-align: center;
}

.specialMenu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-block;
}

.specialMenu ul li {
  float: left;
  margin: 0 5px 0 0;
}

.specialMenu ul li.last {
  margin-right: 0;
}

.specialMenu ul li img {
  display: block;
}
------------------------------ */
/* clearfix */
.specialMenu ul::after {
  content: "";
  display: block;
  clear: both;
}

/* ------------------------------
  メインビジュアル
------------------------------ */
.special-mv {
  margin: 0 0 40px;
  text-align: center;
}

.special-mv img {
  display: block;
  margin: 0 auto;
}

/* ------------------------------
  汎用要素
------------------------------ */
.special.agingcare p {
  margin: 0 0 12px;
}

.special.agingcare ul,
.special.agingcare ol {
  margin: 0 0 12px 20px;
}

.special.agingcare li {
  margin-bottom: 4px;
}

.special.agingcare strong {
  font-weight: bold;
}

/* 区切り線 */
.special.agingcare .special-Line {
  margin: 35px 0 25px;
  text-align: center;
}

.special.agingcare .special-Line img {
  display: block;
  margin: 0 auto;
}

/* セクションブロック */
.special.agingcare .cnt {
  margin-bottom: 35px;
}

/* 箇条書きの頭に◆がつくリスト */
.special.agingcare .list-square {
  margin: 0 0 12px 18px;
}
.special.agingcare .list-square li {
  list-style: square;
}

/* ------------------------------
  リードコピー・サブコピー
------------------------------ */
.special.agingcare .lead-copy {
  text-align: center;
  margin: 10px 0 6px;
  font-size: 14px;
}

.special.agingcare .sub-copy {
  text-align: center;
  margin: 0 0 26px;
}

/* ------------------------------
  表（料金・商品リスト想定）
------------------------------ */
.special.agingcare table.basic-table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 25px;
  font-size: 12px;
}

.special.agingcare table.basic-table th,
.special.agingcare table.basic-table td {
  border-bottom: 1px solid #e3e3e3;
  padding: 6px 8px;
  line-height: 1.6;
}

.special.agingcare table.basic-table th {
  background: #f5f0de;
  font-weight: bold;
  text-align: left;
}

.special.agingcare table.basic-table td.right {
  text-align: right;
  white-space: nowrap;
}

/* =================================================================== */
/*  エイジングケア特集：見出しまわりレイアウト微調整              */
/*  （ニキビ特集 acne.css に寄せた調整）                             */
/* =================================================================== */

/* タイトル画像（ページ冒頭の大きな画像） */
.special.agingcare .aging-title-img {
  text-align: center;
  margin: 30px 0 20px;
}
.special.agingcare .aging-title-img img {
  max-width: 460px;
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------- */
/* 中見出し：画像（<div class="aging-h3-img"><img ...>）           */
/* --------------------------------------------------------------- */

.special.agingcare .aging-h3-img {
  margin: 35px 0 12px;   /* 上の文章と少し離して、下に少し余白 */
}

.special.agingcare .aging-h3-img img {
  display: block;
  height: auto;
  width: auto;          /* 画像本来の横幅を優先 */
  max-width: 100%;      /* はみ出し防止（コンテンツ幅より大きい場合のみ縮小） */
}

/* --------------------------------------------------------------- */
/* 中見出し：テキスト（例：⭐️エイジングケアに特化した抗酸化…） */
/* --------------------------------------------------------------- */

.special.agingcare h3.aging-h3-text {
  font-size: 15px;
  line-height: 1.7;
  font-weight: bold;
  color: #356f73;        /* ページのメインカラーに合わせた見出し色 */
  margin: 8px 0 10px;    /* 上に少し、下に本文との余白 */
}

/* 中見出し画像の直後に来るテキストや段落の上余白を詰める */
.special.agingcare .aging-h3-img + h3.aging-h3-text,
.special.agingcare .aging-h3-img + p {
  margin-top: 0;
}

/* --------------------------------------------------------------- */
/* 大見出し：画像だけを入れている h3（<h3 class="aging-h3"><img>） */
/* --------------------------------------------------------------- */
/* 大見出し：画像だけを入れている h3（中央寄せ） */
.special.agingcare h3.aging-h3 {
  margin: 40px 0 18px;
  padding: 0;
  line-height: 1;
  text-align: center;        /* 中央寄せ */
}
/* 大見出し画像を少し大きめに表示 */
.special.agingcare h3.aging-h3 > img {
  display: block;
  margin: 0 auto;      /* 中央寄せ */
  width: 600px;        /* 表示したい大きさ（お好みで 680〜720px くらいでもOK） */
  max-width: 100%;     /* 万一狭い幅でもはみ出さない保険 */
  height: auto;        /* 縦横比キープ */
}


/* 大見出しのすぐ下に来る段落などの上余白を詰める */
.special.agingcare h3.aging-h3 + p,
.special.agingcare h3.aging-h3 + ul,
.special.agingcare h3.aging-h3 + ol,
.special.agingcare h3.aging-h3 + div {
  margin-top: 0;
}
/* =========================
   エイジング：プラン枠（ニキビ特集のacne-plan相当）
   ========================= */
.special.agingcare .aging-plan{
  border: 1px solid #e3e3e3;
  padding: 18px 16px 16px;
  margin: 18px 0 20px;
  border-radius: 4px;
  background: #fffdfa;
}

.special.agingcare .aging-plan-title{
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 10px;
  line-height: 1.5;
}

/* 枠内の本文余白を整える（好みで微調整OK） */
.special.agingcare .aging-plan p{
  margin: 0 0 10px;
  line-height: 1.8;
}

.special.agingcare .aging-plan p:last-child{
  margin-bottom: 0;
}
/* ▼ エイジングケア特集：プラン枠（ニキビ特集 .acne-plan 相当）▼ */
.special.agingcare .aging-plan {
  border: 1px solid #e3e3e3;
  padding: 18px 16px 16px;
  margin: 18px 0 20px;
  border-radius: 4px;
  background: #fffdfa;
}

.special.agingcare .aging-plan-title {
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 10px;
}
/* ▲ ここまで追加（または上書き） ▲ */
/* クロージングメッセージ */
.okigaru {
  margin: 40px 0 10px;
  text-align: center;
}

.agingcare-closing-text {
  margin: 0 auto 10px;
  max-width: 720px;
  line-height: 1.8;
}

/* ================================
   下部「エイジングケアについて気になることがあれば…」画像
   ニキビ特集と同じくらいのサイズ感に調整
   ================================ */
.special.agingcare .okigaru {
  margin: 40px 0 40px;
  text-align: center;
  padding: 0;
  background: none;
  border: none;
}

.special.agingcare .okigaru img {
  display: block;
  margin: 0 auto;
  width: 700px;      /* 画像本来の横幅まで拡大 */
  max-width: 100%;   /* 枠より大きくならないように */
  height: auto;      /* 縦横比を維持して拡大 */
}

.special.agingcare .okigaru p {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.8;
}
/* ===========================
   エイジングケア：商品画像（PC）
   =========================== */
@media screen and (min-width: 769px){

  .special.agingcare .aging-product-img-pc{
    text-align: center;
    margin: 18px 0 26px;
  }

  .special.agingcare .aging-product-img-pc img{
    display: inline-block;
    width: 200px;        /* ← 大きさ調整 */
    max-width: 100%;
    height: auto;
  }

  /* 袋タイプなど縦長の見栄え調整（任意） */
  .special.agingcare .aging-product-img-pc img[src$="aging_h3_item4.jpg"]{
    width: 260px;
  }
}
.specialMenu {
    width: 544px;
    margin: 50px auto;
}

.specialMenu ul {
    overflow: hidden;
}

.specialMenu li {
    float: left;
    margin-right: 50px;
}

.specialMenu .last {
    margin-right: 0px;
}
/* ===== agingcare: specialMenu を acne と同じ見た目に固定 ===== */
.specialMenu ul{
  display: block;          /* ← inline-block を殺す（高さズレ解消） */
  margin: 0;
  padding: 0;
  list-style: none;
}
