/* 20261005 */

.price-list-style dl {
  display: flex;
  justify-content: space-between; /* 左に施術名、右に金額を配置 */
  align-items: flex-start;
  padding: 16px 0;                /* 上下の余白 */
  border-bottom: 1px solid #333;  /* 下側の区切り線 */
  margin: 0;
}

/* 施術名（左側） */
.price-list-style dt {
  font-weight: bold;
  margin: 0;
}

/* 金額・詳細（右側） */
.price-list-style dd {
  text-align: right;
  margin: 0;
}

/* スタイリスト紹介エリア（横並びレイアウト） */
.stylist-profile {
  display: flex;
  align-items: center; /* 上下中央揃え */
  gap: 30px;          /* 画像とテキストの間隔 */
  margin-top: 20px;
  width: 100%;
  
}

/* スタイリスト画像設定 */
.stylist-img {
 width: 50%;
 flex-shrink: 0;
}

.stylist-img img {
  width: 100%;
  height: auto;      /* 画像の比率を維持して大きく拡大 */
  display: block;
}

/* スタイリスト名 */
.stylist-name {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 12px;
}

.stylist-text {
  width: 50%;
}

div.home4 div.stylist-profile div.stylist-text div.txt p {
  font-size: 18px;
  line-height: 300%;
}

.style-gallery {
  display: flex;
  gap: 15px; /* 画像同士の間隔 */
  justify-content: space-between;
  width: 100%;
}

/* 各画像ブロック（等分割） */
.style-item {
  flex: 1;
  min-width: 0; /* フレックスアイテムのはみ出し防止 */
}

/* 画像の基本表示設定 */
.style-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.style-gallery img,
div.home4 ul li img {
  width: 100%;
  aspect-ratio: 3 / 4;   /* 縦長（3:4）で形を統一。正方形にする場合は 1 / 1 に変更 */
  object-fit: cover;     /* 画像を歪ませずに枠いっぱいにトリミング表示 */
  display: block;
}

.txt.eg p {
  font-size: 18px;
  line-height: 300%;
}


.price-list-style dl.item-with-desc {
  display: flex;
  flex-direction: column; /* 縦に並べる */
  padding: 16px 0;
  border-bottom: 1px solid #333;
}

/* 上段（項目名 ＆ 値段）の横並び配置 */
.price-list-style dl.item-with-desc .item-main {
  display: flex;
  justify-content: space-between; /* 項目名を左、金額を右へ */
  align-items: flex-start;
  width: 100%;
}

/* 下段（説明文章） */
.price-list-style dl.item-with-desc .item-desc {
  width: 100%;
  margin-top: 10px; /* 上（項目・金額）との余白 */
  text-align: left; /* 左揃え */
  font-size: 16px;  /* 読みやすい補足テキストサイズ */
  line-height: 1.6;
}

.price-list-style {
  margin-top: 100px;
}


/* 予約エリア全体枠 */
div.home4.headoffice2 div.reservation-container {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  margin-top: 30px;
  width: 100%;
}


div.home4.headoffice2 .reservation-card {
  flex: 1;
  background: #FFF9F1; /* アイボリー背景 */
  padding: 24px 16px;
  border-radius: 8px;
  text-align: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-decoration: none;
  color: inherit;
}

/* EMAIL・INSTAGRAMカード全体のホバー効果 */
div.home4.headoffice2 a.reservation-card:hover {
  background: #F8EFE3;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

/* --- PHONEカード内の個別の電話リンク指定 --- */
div.home4.headoffice2 .tel-link {
  display: block;
  text-decoration: none;
  color: inherit;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background-color 0.2s ease;
}

div.home4.headoffice2 .tel-link:hover {
  background-color: rgba(0, 0, 0, 0.05); 
}

div.home4.headoffice2 .tel-free-link {
  margin-bottom: 4px;
}

/* 各テキスト指定 */
div.home4.headoffice2 p.res-label {
  font-size: 13px;
  letter-spacing: 0.12em;
  color: #888;
  margin: 0 0 8px 0;
  text-transform: uppercase;
}

div.home4.headoffice2 span.res-tel-free {
  display: block;
  font-size: 22px;
  font-weight: bold;
  color: #333;
  line-height: 1.2;
}

div.home4.headoffice2 span.res-tel-sub {
  display: block;
  font-size: 12px;
  color: #777;
  margin-top: 2px;
}

div.home4.headoffice2 span.res-tel-int {
  display: block;
  font-size: 13px;
  color: #444;
  font-weight: 500;
}

/* メール・インスタ・補足文 */
div.home4.headoffice2 p.res-main-text {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  margin: 0 0 6px 0;
  word-break: break-all;
}

div.home4.headoffice2 p.res-desc {
  font-size: 14px;
  color: #777;
  margin: 0;
}

/* Instagram アイコン配置 */
div.home4.headoffice2 div.insta-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 8px;
}

div.home4.headoffice2 div.insta-icon img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block;
}

div.home4.headoffice2 div.insta-text {
  text-align: left;
}

div.home4.headoffice2 div.insta-text p {
  margin: 0;
}

/* 新クラス（price-page-menu）が指定されている場所のみ width: auto を適用 */
div.menubox.price-page-menu div.menubox-inn dl dt + dd {
  width: auto;
  float: right;
  text-align: right;
}

/* 左右を綺麗に分散配置したい場合 */
div.menubox.price-page-menu div.menubox-inn dl {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}


div.menubox.price-page-menu div.menubox-inn dl dt + dd {
  width: auto;
  float: right;
  text-align: right;
}

div.menubox.price-page-menu div.menubox-inn dl {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  white-space: nowrap;
}

.newswap.enblog {
  width: 100%;
}

.newswap.enblog .newskiji {
  width: 28%;
}