@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/*--------------------------------------------------
 共通：リンク・ボタンのホバー色（完全統一）
--------------------------------------------------*/

.wp-block-button {
  background: none !important;
  padding: 0;
  margin: 0 auto;
  display: inline-block;
}

.wp-block-button .wp-block-button__link,
.wp-block-button__link {
  background-color: #ffaa56 !important;
  color: #ffffff !important;
  transition: background-color 0.3s ease, color 0.3s ease;
  text-decoration: none;
  padding: 0.7em 1.5em;
  border-radius: 3px;
  display: inline-block;
  font-weight: 600;
  box-sizing: border-box;
  text-align: center;
}

.wp-block-button .wp-block-button__link:hover,
.wp-block-button__link:hover {
  background-color: #2e3963 !important;
  color: #ffffff !important;
}

/*--------------------------------------------------
 ヘッダー・ロゴ・日付など
--------------------------------------------------*/
.logo-menu-button img,
.header-container-in.hlt-top-menu .logo-header img {
  max-height: 30px;
}

.date-tags {
  text-align: left;
}
.page .date-tags {
  display: none;
}

div#list-wrap .list-new-entries {
  display: none;
}

button.wp-block-search__button.wp-element-button {
  background: #2e3963;
}

h3.widget-sidebar-title.widget-title {
  background: #f4f4f4;
  color: #333333;
}

/*--------------------------------------------------
 テーブル
--------------------------------------------------*/
table {
  width: 100%;
  border-collapse: collapse;
}
table, th, td {
  border: 1px solid #ccc;
}
th, td {
  padding: 10px;
  text-align: left;
}

/*--------------------------------------------------
 フッター・戻るボタン
--------------------------------------------------*/
.footer-bottom {
  margin: 0;
  padding: 0;
}

go-to-top-button {
  border-radius: 0;
}

/*--------------------------------------------------
 トップページ：サムネイルメニュー
--------------------------------------------------*/
.front-top-page main,
.front-top-page .content,
.front-top-page .entry-content.cf {
  padding-top: 0;
  margin-top: 0;
}
.front-top-page .entry-title {
  display: none;
}

.top-thumbnail-menu.is-layout-flex {
  gap: 0;
}
.top-thumbnail-menu div figure a {
  height: calc(95vh - 60px);
  display: block;
  overflow: hidden;
  position: relative;
}
.top-thumbnail-menu div figure a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
  z-index: 1;
  position: relative;
}
.top-thumbnail-menu div figure a:hover img {
  transform: scale(1.1);
}
.top-thumbnail-menu div figure a::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(46, 57, 99, 0.15);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 2;
  pointer-events: none;
}
.top-thumbnail-menu div figure a:hover::after {
  opacity: 1;
}

.top-thumbnail-menu div figure.wp-block-image {
  margin-bottom: 0;
}
.top-thumbnail-menu p.top-thumbnail-menu-title {
  height: 5em;
  margin-top: -5em;
  padding: 0;
  text-shadow: 0 0 5px black;
  position: relative;
  z-index: 100;
}

@media screen and (max-width:1023px){
  .top-thumbnail-menu.is-layout-flex {
    display:flex;
  }
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: 50% !important;
  }
  .top-thumbnail-menu div figure a {
    height: calc(44vh - 50px);
  }
}

/************************************
** ▼ Worksカード：白帯完全除去＋3カラム＋ホバー維持 ▼
************************************/

/* グリッド3カラム */
.works-grid > .wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin: 40px 0;
  padding: 0 !important;
  list-style: none;
  box-sizing: border-box;
}

/* 各記事カード */
.works-grid > .wp-block-post-template li {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 0px;　/* ← 数字を入れて角を丸くする！ */
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  overflow: hidden;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* アイキャッチ画像も直角に（念のため） */
.works-grid li div a img {
  border-radius: 0 !important;
}
/* アイキャッチ画像のみホバー */
.works-grid li div a {
  display: block;
  position: relative;
  overflow: hidden;
  margin: 0 !important;
}
.works-grid li div a img {
  width: 100%;
  height: 230px;
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
  display: block;
}
.works-grid li div a:hover img {
  transform: scale(1.1);
}

/* タイトルエリア全体の余白を完全除去 */
.works-grid .wp-block-post-title {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  height: auto !important;
  line-height: 1.0 !important;
  min-height: unset !important;
  border: none !important;
  box-shadow: none !important;
  display: block;
}

/* タイトルリンク（紺色帯） */
.works-grid .wp-block-post-title a {
  display: block;
  width: 100%;
  margin: 0 !important;
  padding: 14px 0 !important;
  background-color: #2e3963 !important;
  color: #ffffff !important;
  text-align: center;
  text-decoration: none;
  font-size: 1.1em;
  line-height: 1.4;
  border-radius: 0 !important;
  box-sizing: border-box;
}

/* ホバーしても色そのまま */
.works-grid .wp-block-post-title a:hover {
  background-color: #2e3963 !important;
  color: #ffffff !important;
}

/* Groupブロックや内部余白除去（Cocoonで自動生成される場合あり） */
.works-grid .wp-block-group {
  margin: 0 !important;
  padding: 0 !important;
}
.works-grid .wp-block-group__inner-container {
  margin: 0 !important;
  padding: 0 !important;
}

/* スマホ：1カラム */
@media screen and (max-width: 768px) {
  .works-grid > .wp-block-post-template {
    grid-template-columns: 1fr !important;
  }
}
.works-grid li div a {
  position: relative;
  overflow: hidden;
}

.works-grid li div a::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(46, 57, 99, 0.15); /* ← 透明度を0.12に調整 */
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 1;
}

.works-grid li div a:hover::after {
  opacity: 1;
}

/*--------------------------------------------------
 更新情報ブロック（Nintendo風仕上げ）※flex方式に戻したバージョン
--------------------------------------------------*/
.top-information-list {
  list-style: none;
  padding: 0 16px;
  margin: 0 auto;
  max-width: 800px;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  gap: 0;
  box-sizing: border-box;
  align-items: center;
}

.top-information-list .wp-block-post {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  border-bottom: 1px solid #e0e0e0;
  padding: 14px 0;
  gap: 10px;
  flex-wrap: wrap;
  width: 100%;
  max-width: 680px;
  box-sizing: border-box;
}

.top-information-list .wp-block-post-date {
  color: #555;
  font-size: 13px;
  white-space: nowrap;
  font-weight: 500;
  min-width: 100px;
  margin-top: 2px;
}

.top-information-list .wp-block-post-terms,
.top-information-list .wp-block-post-terms a {
  background-color: #f0f0f0;
  color: #444 !important;
  width: 88px;
  text-align: center;
  padding: 1px 0;
  font-size: 11px;
  font-weight: bold;
  border-radius: 0;
  display: inline-block;
  text-decoration: none;
  transition: background-color 0.3s ease;
  white-space: nowrap;
  margin-top: 1px;
}

.top-information-list .wp-block-post-terms a:hover {
  background-color: #ccc;
}

.top-information-list .wp-block-post-title {
  flex-grow: 1;
  margin-top: 1px;
  min-width: 100%;
  box-sizing: border-box;
}

ul.top-information-list li h1.wp-block-post-title a,
body.page-id-2004 h2.wp-block-post-title a,
.top-information-list .wp-block-post-title a {
  font-size: 13px !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
  color: #000 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  display: inline;
}

ul.top-information-list li.wp-block-post .wp-block-post-title a:hover {
  color: #2e3963 !important;
  text-decoration: underline !important;
}

@media screen and (max-width: 768px) {
  .top-information-list {
    max-width: 100% !important;
    margin: 0 auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
  }

  .top-information-list .wp-block-post {
    width: 100% !important;
    box-sizing: border-box;
    margin: 0 !important;
  }

  .top-information-list .wp-block-post-title,
  .top-information-list .wp-block-post-date,
  .top-information-list .wp-block-post-terms {
    box-sizing: border-box;
  }
}

@media screen and (max-width: 768px) {
  /* クエリループ全体を中央に */
  .top-information-list {
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* 各記事ブロックも幅を100%指定 */
  .top-information-list .wp-block-post {
    width: 100% !important;
    box-sizing: border-box;
  }

  /* WordPressブロックに幅制限があれば強制解除 */
  .wp-block-group,
  .wp-block-query,
  .wp-block-query-loop {
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 16px !important;
    box-sizing: border-box;
  }
}

/*--------------------------------------------------
 モバイル：更新情報ブロックの中央寄せ＆スペース解消
--------------------------------------------------*/
@media screen and (max-width: 768px) {
  .top-information-list {
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .top-information-list .wp-block-post {
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 680px !important;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  .wp-block-query,
  .wp-block-query-loop,
  .wp-block-group,
  .is-layout-flow,
  .is-layout-flex {
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  ul.wp-block-post-template {
    padding-left: 0 !important;
  }
}


/*--------------------------------------------------
Youtube埋め込み中央揃え補助
--------------------------------------------------*/
.video-wrapper {
  max-width: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.video-wrapper iframe {
  width: 100%;
  max-width: 560px;
  aspect-ratio: 16 / 9;
  border: none;
}

/*--------------------------------------------------
↓公式LINEお問い合わせデザイン
--------------------------------------------------*/
.line-contact-block {
  background: #e6f5ec;
  border: 2px solid #00c300;
  padding: 30px 20px;
  border-radius: 8px;
  margin: 40px auto;
  max-width: 700px;
  text-align: center;
}

.line-contact-block h2 {
  font-size: 1.4em;
  color: #00a000;
  margin-bottom: 10px;
}

.line-contact-block p {
  font-size: 1em;
  color: #333;
  margin-bottom: 20px;
}

.line-contact-block .line-btn img {
  width: 200px;
  max-width: 90%;
  height: auto;
  transition: transform 0.2s ease-in-out;
}

.line-contact-block .line-btn img:hover {
  transform: scale(1.05);
}


/*--------------------------------------------------
* Contact Form 7：フォーム全体 
--------------------------------------------------*/

.wpcf7 {
  max-width: 600px;
  margin: 30px auto;
  padding: 24px;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.6;
}

/* ラベル */
.wpcf7 label {
  display: block;
  font-weight: bold;
  margin-bottom: 6px;
  color: #333;
}

/* テキスト系入力欄 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 2px;
  font-size: 14px;
  box-sizing: border-box;
  background-color: #fff;
  transition: border-color 0.3s;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus {
  border-color: #5bc0de;
  outline: none;
}

/* テキストエリアサイズ */
.wpcf7 textarea {
  min-height: 120px;
  resize: vertical;
}

/* ラジオ・チェックボックス類 */
.wpcf7 input[type="radio"],
.wpcf7 input[type="checkbox"] {
  margin-right: 8px;
}

/* 送信ボタン */
.wpcf7 input[type="submit"] {
  background-color: #ff7e00;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  border: none;
  padding: 12px 24px;
  margin-top: 20px;
  cursor: pointer;
  border-radius: 4px;
  display: inline-block;
  transition: background-color 0.3s ease;
}

.wpcf7 input[type="submit"]:hover {
  background-color: #e56f00;
}

/* バリデーションメッセージ */
.wpcf7-not-valid-tip {
  color: #e53935;
  font-size: 12px;
  margin-top: 2px;
}

/* 送信後メッセージ */
.wpcf7-response-output {
  margin-top: 20px;
  padding: 10px;
  border: 1px solid #4caf50;
  background: #e8f5e9;
  color: #2e7d32;
}


/*--------------------------------------------------
* ↓電話問い合わせフォーム
--------------------------------------------------*/
.contact-tel-box {
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 20px;
  margin: 30px auto;
  max-width: 600px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  font-family: sans-serif;
}

.contact-tel-label {
  font-size: 16px;
  font-weight: bold;
  color: #2e3963;
  margin-bottom: 12px;
  text-align: center;
}

.contact-tel-info {
  text-align: center;
}

.contact-tel-company {
  font-weight: 600;
  margin-bottom: 6px;
  font-size: 14px;
}

.contact-tel-number a {
  display: inline-block;
  font-size: 22px;
  color: #ff7e00;
  text-decoration: none;
  font-weight: bold;
}

.contact-tel-number a:hover {
  text-decoration: underline;
}

.contact-tel-time {
  font-size: 13px;
  color: #666;
  margin-top: 8px;
}


/* スライダー全体：角丸なし＋影付きのスクエアデザイン */
.flexslider, .metaslider {
  border-radius: 0; /* ←角丸なし */
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0); /* 影 */
  background-color: #fff;
  transition: box-shadow 0.3s ease;
}

/* スライド画像：自然なズーム */
.flexslider .slides img {
  width: 100%;
  height: auto;
  transition: transform 0.5s ease;
}
.flexslider .slides li:hover img {
  transform: scale(1.02);
}

/* ナビ矢印：フラットなモダンデザイン */
.flex-direction-nav a {
  background-color: rgba(0, 0, 0, 0.3);
  color: #fff;
  border-radius: 0; /* ←角なし */
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-size: 20px;
  text-align: center;
  transition: background-color 0.3s ease;
}
.flex-direction-nav a:hover {
  background-color: rgba(0, 0, 0, 0.6);
}

/* スマホ対応：ナビ矢印を少し小さく */
@media screen and (max-width: 768px) {
  .flex-direction-nav a {
    width: 32px;
    height: 32px;
    font-size: 16px;
    line-height: 32px;
  }
}

/* スマホでは非表示（〜768px） */
@media screen and (max-width: 768px) {
  .pc-only {
    display: none !important;
  }
}

/* PCでは非表示（769px以上） */
@media screen and (min-width: 769px) {
  .sp-only {
    display: none !important;
  }
}

/* ==== 共通レイアウト（PC・タブレット共通） ==== */
.archive.category .entry-card-wrap {
  width: 31% !important;
  margin: 1% !important;
  float: left !important;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  background-color: #fff;
  transition: all 0.3s ease;
  display: flex !important;
  flex-direction: column;
  height: auto;
  min-height: 430px;
}

/* ==== アイキャッチ画像 ==== */
.archive.category .entry-card-thumb {
  width: 100%;
  height: 200px !important;
  overflow: hidden;
  display: block !important;
}
.archive.category .entry-card-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* ==== 本文エリア ==== */
.archive.category .entry-card-content {
  padding: 15px !important;
  flex-grow: 1;
  display: flex !important;
  flex-direction: column;
  justify-content: space-between;
}

/* ==== タイトル・抜粋・日付 ==== */
.archive.category .entry-card-title {
  font-size: 16px !important;
  font-weight: bold;
  margin-bottom: 10px;
  color: #333 !important;
}
.archive.category .entry-card-snippet {
  font-size: 14px;
  color: #666;
  flex-grow: 1;
}
.archive.category .entry-card-date {
  font-size: 13px;
  color: #aaa;
  margin-top: 10px;
}

/* ==== ホバー演出 ==== */
.archive.category .entry-card-wrap:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/* ==== レスポンシブ対応 ==== */
@media screen and (max-width: 1024px) {
  .archive.category .entry-card-wrap {
    width: 48% !important;
  }
}
@media screen and (max-width: 768px) {
  .archive.category .entry-card-wrap {
    width: 100% !important;
    margin-bottom: 20px !important;
    float: none !important;
  }
}

@media screen and (max-width: 768px) {
  .entry-card-snippet {
    display: block !important;
  }
}


/*--------------------------------------------------
  リーベルホーム 店舗カード おしゃれデザイン（単体用）
--------------------------------------------------*/

.store-card {
  background: #ffffff;
  border-radius: 0px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  padding: 24px;
  margin-bottom: 40px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-height: 520px;
}

.store-content {
  flex-grow: 1;
}

.store-footer {
  margin-top: auto;
}

.store-card h5 {
  font-size: 1.3em;
  font-weight: 600;
  margin-bottom: 12px;
  padding-left: 10px;
  border-left: 4px solid #ffaa56;
  color: #333;
}

.store-card p {
  font-size: 0.95em;
  color: #555;
  margin: 6px 0;
  line-height: 1.6;
}

.store-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  margin-top: 12px;
  border-radius: 30px;
  font-weight: bold;
  font-size: 0.9em;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.store-btn.tel {
  background: linear-gradient(to right, #ffaa56, #f26b3f);
  color: #fff;
}

.store-btn.tel:hover {
  transform: translateY(-2px);
  background: linear-gradient(to right, #f7941d, #ef3f2f);
}

.store-btn.line {
  background: #06C755;
  color: #fff;
}

.store-btn.line:hover {
  background: #04b04a;
  transform: translateY(-2px);
}

.line-logo {
  width: 18px;
  height: 18px;
  vertical-align: middle;
}

.map-fixed {
  margin-top: 16px;
  height: 180px;
  overflow: hidden;
  border-radius: 12px;
}

.map-fixed iframe {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 12px;
}


/*--------------------------------------------------
  リーベルホーム 店舗カード おしゃれデザイン（単体用）
--------------------------------------------------*/

.store-card {
  background: #ffffff;
  border-radius: 0px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  padding: 24px;
  margin-bottom: 40px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-height: 520px;
}

.store-content {
  flex-grow: 1;
}

.store-footer {
  margin-top: auto;
}

.store-card h5 {
  font-size: 1.3em;
  font-weight: 600;
  margin-bottom: 12px;
  padding-left: 10px;
  border-left: 4px solid #ffaa56;
  color: #333;
}

.store-card p {
  font-size: 0.95em;
  color: #555;
  margin: 6px 0;
  line-height: 1.6;
}

.store-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  margin-top: 12px;
  border-radius: 30px;
  font-weight: bold;
  font-size: 0.9em;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.store-btn.tel {
  background: linear-gradient(to right, #ffaa56, #f26b3f);
  color: #fff;
}

.store-btn.tel:hover {
  transform: translateY(-2px);
  background: linear-gradient(to right, #f7941d, #ef3f2f);
}

.store-btn.line {
  background: #06C755;
  color: #fff;
}

.store-btn.line:hover {
  background: #04b04a;
  transform: translateY(-2px);
}

.line-logo {
  width: 18px;
  height: 18px;
  vertical-align: middle;
}

.map-fixed {
  margin-top: 16px;
  height: 180px;
  overflow: hidden;
  border-radius: 12px;
}

.map-fixed iframe {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 12px;
}

/* --------------------------------------------------
  カテゴリ一覧ページ用ビジュアルエリア（共通）
-------------------------------------------------- */

/* ラッパー：画面幅に強制フィット */
.shacho-blog-hero-wrapper {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: hidden;
  z-index: 1;
}

/* 背景ビジュアル（社長ブログ用） */
.shacho-blog-hero {
  width: 100%;
  height: 300px;
  background: url('http://liber-home.co.jp/wp-content/uploads/2025/04/e2d706b0a0c01da23e4908bb60bfb6a0.jpg') center center / cover no-repeat;
  position: relative;
}

/* 背景ビジュアル（インフォメーション用） */
.normal-blog-hero {
  width: 100%;
  height: 300px;
  background: url('http://liber-home.co.jp/wp-content/uploads/2025/04/b36d159246d064b9c66878a519aaab80.jpg') center center / cover no-repeat;
  position: relative;
}

/* テキストブロック（中央配置） */
.shacho-blog-hero-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 100%;
  padding: 0 5vw;
  box-sizing: border-box;
  text-align: center;
  color: white;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);
}

/* メインタイトル（太字・大きめ） */
.hero-main-title {
  font-size: 2.5rem;
  font-weight: bold;
  line-height: 1.3;
  margin: 0;
}

/* サブタイトル（通常太さ・少し小さめ） */
.hero-sub-title {
  font-size: 1.5rem;
  font-weight: normal;
  line-height: 1.3;
  margin: 0;
}

/* --------------------------------------------------
  スマホ対応（767px以下）
-------------------------------------------------- */
@media (max-width: 767px) {
  .shacho-blog-hero {
    height: 200px;
  }

  .normal-blog-hero {
    height: 200px;
  }

  .hero-main-title {
    font-size: 1.2rem;
    font-weight: bold; /* 念のため再定義 */
    letter-spacing: -0.5px;
  }

  .hero-sub-title {
    font-size: 1rem;
    font-weight: normal;
  }
}



/* --------------------------------------------------
トップページのタイトルを1行に（スマホでも）
-------------------------------------------------- */
@media (max-width: 767px) {
  .toppage-catchcopy { /* ←実際の対象クラスに合わせてください */
    font-size: 1rem; /* 小さくする */
    white-space: normal; /* nowrapはやめる */
    word-break: keep-all; /* 単語内で折り返し禁止（日本語にも有効） */
    text-align: center; /* 念のため中央揃え */
  }
}

/* --------------------------------------------------
/* ▼フッター背景色・文字色の変更 */
-------------------------------------------------- */
#footer {
  background-color: #1f1f1f;
  color: #ffffff;
}

/* ▼リンクの色 */
#footer a {
  color: #ffffff;
  text-decoration: none;
}

#footer a:hover {
  color: #ffd700;
  text-decoration: underline;
}

/* ▼SNSバナーをカード風に整列（ラップが必要） */
.footer-sns-wrapper {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding: 2rem 1rem;
}

.footer-sns-wrapper a {
  display: inline-block;
  background-color: #fff;
  border-radius: 12px;
  padding: 1rem 1.5rem;
  color: #333;
  font-weight: bold;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  min-width: 200px;
  text-align: center;
}

.footer-sns-wrapper a:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

/* ▼コピーライト部分の中央揃え＋余白 */
#footer .footer-bottom {
  text-align: center;
  font-size: 0.9em;
  padding: 1.5rem 0;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: 1rem;
}