/* ▼ 共通・汎用パーツ ▼ */
.main_visual { position: relative; margin-bottom:24px;}
.area_catch { position: absolute; top: 50%; transform: translateY(-50%); }
.common_bnr { width: auto; }
.common_bnr._styles { margin-top: 24px; margin-bottom: 32px; }
.common_bnr._styles .area_img_txt { width: 58%; left: 2%; }
/* .common_bnr._styles h2::after { content: ''; position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); background: #9b7846; width: 18%; height: 6px; } */
h2.heading_sytles { text-align: center; font-size: 40px; font-weight: bold; color: #333; line-height: 1;margin: 8px 0 16px;}
.common_txt_style { font-size: 17px; margin: 0.5em 0 0; }
.marker-half { background: linear-gradient(transparent 60%, #ffff66 60%); }
.adjust_micro { font-weight: bold; color: #9b7846; font-size:21px;}

/* ▼ お父さんタイプ切り替えナビ ▼ */
.father_type_wrap { background-color: #2b3899; padding: 40px 20px; border-top: 2px solid #9b7846; border-bottom: 2px solid #9b7846; }
.father_type_title { color: #ffffff; font-size: 28px; text-align: center; margin-bottom: 30px; letter-spacing: 0.1em; font-weight: bold; }
.father_type_nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 1.5%; list-style: none; padding: 0; margin: 0 auto; max-width: 1000px; }
.type_item { width: 18.8%; cursor: pointer; transition: opacity 0.3s; }
.type_item:hover { opacity: 0.7; }
.type_item.active .type_inner { background-color: rgba(200, 169, 126, 0.1); box-shadow: 0 0 10px rgba(200, 169, 126, 0.3); }
/* 修正後（paddingの値を変更） */
.type_inner { border: 1px solid #9b7846; border-radius: 100px 100px 0 0; padding: 15px 5px 15px; text-align: center; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.type_img { width: 80%; aspect-ratio: 1; border-radius: 50%; overflow: hidden; margin-bottom: 15px; background-color: #333; }
.type_img img { width: 100%; height: 100%; object-fit: cover; }
/* 修正後 */
.type_name { color: #fff; font-weight: bold; font-size: 16px; margin: 0; letter-spacing: 0.05em; text-align: center; }
.type_desc { color: #9b7846; font-size: 13px; line-height: 1.5; margin: 0; }
.father_type_contents { padding: 0; text-align: center; }

/* ▼ .heading_sytles ▼ */
.type_lead_box { background: #fdfaf6; padding: 20px; border-radius: 8px; text-align: center; border: 1px solid #9b7846; }
.lead_title { color: #9b7846; font-size: 18px; font-weight: bold; margin: 0 0 10px; }
.lead_text { font-size: 16px; color: #333; margin: 0; line-height: 1.6; text-align: left; }

/* ▼ タイプ別商品エリア：リストレイアウト ▼ */
.wrap_type_product { display: flex; flex-wrap: wrap; gap: 2%; width: 100%; margin: 0 auto; }
.e87-column-image__single_small { position: relative; width: 32%; margin-bottom: 2%; padding: 8px; background: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); box-sizing: border-box; transition: 0.3s; }
.e87-column-image__single_small:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.1); transform: translateY(-3px); }
.product_link_area { text-decoration: none; color: inherit; display: block; }
.recommend_badge { position: absolute; top: -10px; left: -10px; background: #9b7846; color: #fff; padding: 6px 16px; font-size: 16px; font-weight: bold; border-radius: 20px; z-index: 10; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }

/* ▼ 商品情報テキスト・価格 ▼ */
._name { font-size: 15px; font-weight: bold; text-align: center; margin: 12px 0 8px; color: #333; line-height: 1.4; }
._price { color: #2b3899; font-size: 18px; font-weight: bold; text-align: center; margin: 0 0 12px; }
.tax_in { font-size: 12px; font-weight: normal; }

/* ▼ 商品おすすめポイント ▼ */
.area_des { background: #fff4f4; padding: 12px; text-align: left; color: #333; border-radius: 4px; font-size: 15px; line-height: 1.5; margin-bottom: 16px; }
.e87-column-image__single_small h3 { color: #e66784; text-align: center; margin: 0 1em 0.5em; font-weight: bold; font-size: 16px; }
.area_des p { margin: 0; font-weight: bold; color: #555; line-height: 1.6;font-size: 17px;}
.adjust_point { color: #e66784; font-weight: bold; margin-bottom: 4px; display: block; }
.adjust_point_sub { color: #9b7846; font-weight: bold;}
.adjust_strong {font-size:large;}

/* ▼ ボタン（CTA） ▼ */
._button { margin: 0 auto; background: #2b3899; color: #fff; width: 90%; padding: 12px 5px; border-radius: 25px; position: relative; text-align: center; line-height: 1; font-weight: bold; font-size: 14px; transition: 0.2s; }
._button::after { content: ""; position: absolute; margin: auto; top: 50%; right: 2em; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg) translateY(-50%); transition: 0.2s; }
.product_link_area:hover ._button { background: #182479; }
.e87-column-image__single_small a ._button.soldout { background: #636363; }
.e87-column-image__single_small a:hover ._button::after { right: 1.5em; }
.e87-column-image__single_small a:hover ._button.soldout::after { right: 2em; }

/* ▼ スマホ用調整（1カラムに） ▼ */
@media screen and (max-width: 768px) {
  .wrap_type_product { gap: 20px 0; }
  .e87-column-image__single_small { width: 100%; padding: 12px; }
  .lead_title { font-size: 16px; }
  ._name { font-size: 14px; }
  ._price { font-size: 16px; }
}

.area_catch h1{font-size:36px;color: #333;}
.area_catch p{width:58%;margin:0 auto;font-weight:bold;}
.adjust_heading{font-size:48px;font-weight: bold;color: #4c5cd3;}

/* ▼ アクティブ（選択中）のタブの装飾 ▼ */
.type_item.active { position: relative; opacity: 1; }
.type_item.active .type_inner { background-color: #9b7846; border: 1px solid #9b7846; box-shadow: 0 4px 10px rgba(200, 169, 126, 0.4); }
.type_item.active .type_name { color: #0d152a; } /* 文字色を濃紺にして読みやすく */
.type_item.active .type_desc { color: #0d152a; font-weight: bold; }

/* 選択中タブの下に下向き矢印(三角形)をつける */
.type_item.active::after { content: ""; position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%); border-top: 12px solid #9b7846; border-right: 12px solid transparent; border-left: 12px solid transparent; z-index: 2; }

/* ▼ アンカースクロール用の調整 ▼ */
.tab_content_box {
    display: block !important; /* タブ用の非表示(display:none)を強制的に解除してすべて表示 */
    margin-bottom: 80px;       /* 各エリアの下の余白 */
    scroll-margin-top:
    
    40px;   /* ★ここでジャンプ先の停止位置を「40px手前」にずらします */
}

.area_des_quote { position: relative; background: #fdfaf6; padding: 24px 16px; border-radius: 8px; text-align: left; margin-bottom: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.03); overflow: hidden; }
.area_des_quote::before { content: "“"; font-family: "Times New Roman", serif; position: absolute; top: -15px; left: 10px; font-size: 80px; color: rgba(200, 169, 126, 0.2); line-height: 1; }
.area_des_quote p { position: relative; z-index: 1; margin: 0; color: #333; line-height: 1.6; font-size: 15px; font-weight: bold; }

.area_des_elegant { background: #fffcf9; padding: 16px; border: 1px solid #9b7846; border-radius: 4px; margin-bottom: 16px; text-align: center; }
.area_des_elegant p { margin: 0; color: #333; line-height: 1.6; font-size: 15px; font-weight: bold; }

.area_des_typo { background: transparent; padding: 12px 8px; margin-bottom: 16px; text-align: center; border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; }
.area_des_typo p { margin: 0; line-height: 1.6; }
.txt_target { font-size: 13px; color: #666; font-weight: normal; }
.txt_benefit { font-size: 16px; color: #e66784; font-weight: bold; }

.area_des_leftline { background: #fcf9f9; padding: 14px 16px; border-left: 4px solid #e66784; border-radius: 0 4px 4px 0; margin-bottom: 16px; text-align: left; }
.area_des_leftline p { margin: 0; color: #444; line-height: 1.6; font-size: 15px; font-weight: bold; }

.area_des_topbottom { background: transparent; padding: 16px 8px; border-top: 1px solid #9b7846; border-bottom: 1px solid #9b7846; margin-bottom: 16px; text-align: center; }
.area_des_topbottom p { margin: 0; color: #333; line-height: 1.6; font-size: 15px; font-weight: bold; }

.area_des_card { background: #ffffff; padding: 16px; border-radius: 6px; margin-bottom: 16px; text-align: left; box-shadow: 0 3px 10px rgba(0,0,0,0.06); border: 1px solid #f0f0f0; }
.area_des_card p { margin: 0; color: #444; line-height: 1.6; font-size: 15px; font-weight: bold; }

.adjust_heading_type{font-size: 21px;display: block;text-align: center;color: #9b7846;font-weight: bold;margin-bottom: 12px;letter-spacing: -1px;}