@charset "utf-8";
/*
Theme Name: crepeandespresso_fc
Theme URI: http://enmusubi426.wp.xdomain.jp/
Description: クレープとエスプレッソとFCオリジナルテーマ
Version: 2.0
Author: Hisae Komatsu
Author URI: http://enmusubi426.wp.xdomain.jp/
*/
/*------------------- PC表示レイアウト ------------------------------*/
h2.section-title {
  width: fit-content;
  color: #714c4c;
  font-size: 2em;
  text-align: center;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", serif;

  /* --- 位置の調整はここで行います --- */
  margin-top: 12rem;    /* 【1】FV動画からの距離（お好みで13%からpx指定に変更） */
  margin-bottom: 20px;  /* 【2】タイトル下のクレープ画像までの距離 */
  margin-left: auto;
  margin-right: auto;
  
  padding-bottom: 10px; /* タイトル自体の下の余白 */
}
.campaign-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  padding: 0;
}
.campaign-item {
  width: calc(50% - 10px);
  background-color: #f9f9f9;
  padding: 15px;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.campaign-item .thumb img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}
/* カスタム投稿ページのスタイル */
/* メインコンテンツとサイドバーを横並びにし、サイドバーを右側に配置 */
/* メインコンテンツとサイドバーを並べる */
.container-info .row-info {
  display: flex;
  /* flex-wrap: wrap; */
  gap: 20px; /* コンテンツとサイドバーの間隔を調整 */
  margin-top: 25px;
}
.container-info {
  width: 1180px;
  height: auto;
  max-width: 100%;
  margin: 0 auto;
}
/* メインコンテンツの幅を調整 */
.container-info .row-info .col-md-9-info {
  /*flex: 1 1 65%; /* メインコンテンツを60%幅に */
  width: 800px;
  max-width: 98%;
}
/* サイドバーの幅を調整 */
.container-info .row-info .col-md-3 {
  /* flex: 1 1 30%; /* サイドバーを30%幅に */
}
/* 投稿ページ全体 */
.single-info_limited_menu {
  background-color: #f9f9f9;
  padding: 40px 0;
}
/* パンくずリスト周りのレイアウト */
.info-page {
  height: 65px;
}
.breadcrumbs-info {
  top: 0.2vw;
}
/*.single-info_limited_menu .container {
  max-width: 1200px;
  margin: 0 auto;
}*/
/* 投稿タイトル */
.single-info_limited_menu .post-title {
  font-size: 2.5em;
  font-weight: bold;
  color: #333;
  margin-bottom: 20px;
}
/* 投稿サムネイル */
.single-info_limited_menu .post-thumbnail {
  margin-bottom: 20px;
}
.single-info_limited_menu .post-thumbnail .thumb {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
/* 投稿本文 */
.single-info_limited_menu .post-content {
  font-size: 1.2em;
  line-height: 1.6;
  color: #555;
  margin-bottom: 30px;
}
/* カスタムフィールド */
.single-info_limited_menu .custom-fields {
  background-color: #f0f0f0;
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 30px;
}
.single-info_limited_menu .custom-fields h3 {
  font-size: 1.5em;
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
}
.single-info_limited_menu .custom-fields p {
  font-size: 1.1em;
  color: #555;
}
/* 関連記事 */
.single-info_limited_menu .related-posts {
  margin-top: 40px;
}
.single-info_limited_menu .related-posts h2 {
  font-size: 2em;
  font-weight: bold;
  color: #333;
  margin-bottom: 20px;
}
.single-info_limited_menu .related-posts ul {
  list-style-type: none;
  padding: 0;
}
.single-info_limited_menu .related-posts li {
  margin-bottom: 15px;
}
.single-info_limited_menu .related-posts li a {
  font-size: 1.2em;
  color: #0073e6;
  text-decoration: none;
}
.single-info_limited_menu .related-posts li a:hover {
  color: #e60000;
}
/* サイドバー */
/* サイドバーのタイトルフォントのサイズ */
.wp-block-heading {
  font-size: 20px;
}
.sidebar {
  background-color: #f4f4f4;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  width: 350px;
  max-width: 98%;
}
.sidebar .widget-title {
  font-size: 1.5em;
  margin-bottom: 20px;
  text-align: center;
  color: #333;
}
.sidebar .widget a {
  display: block;
  padding: 10px;
  font-size: 1.1em;
  color: #333;
  text-decoration: none;
  border-radius: 5px;
  margin-bottom: 10px;
  transition: background-color 0.3s ease;
}
.sidebar .widget a:hover {
  background-color: #e60000;
  color: white;
}
/* サイドメニューのカテゴリ一覧 */
.sidebar .widget .category-list {
  list-style-type: none;
  padding: 0;
}
.sidebar .widget .category-list li {
  margin-bottom: 10px;
}
.sidebar .widget .category-list li a {
  font-size: 1.1em;
  color: #333;
  text-decoration: none;
  display: block;
  padding: 8px;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}
.sidebar .widget .category-list li a:hover {
  background-color: #e60000;
  color: white;
}
/* 画面幅が768px以上の場合 */
@media (min-width: 768px) {
  .container-info .row-info {
    flex-direction: row-reverse; /* サイドバーを右側に */
  }
  .container-info .row-info .col-md-9-info {
    order: 2; /* メインコンテンツを左側に */
    /* flex: 1 1 65%; /* メインコンテンツを60%幅に */
  }
  .container-info .row-info .col-md-3 {
    order: 1; /* サイドバーを右側に */
    /*  flex: 1 1 30%; /* サイドバーを30%幅に */
  }
}
/* 画面幅が768px未満の場合 */
@media (max-width: 767px) {
  .container-info .row-info {
    flex-direction: column; /* サイドバーを下に配置 */
  }
  .container-info .row-info .col-md-9-info {
    flex: 1 1 100%; /* メインコンテンツをフル幅に */
  }
  .container-info .row-info .col-md-3 {
    flex: 1 1 100%; /* サイドバーをフル幅に */
    margin-top: 20px; /* サイドバーとコンテンツの間にスペースを追加 */
  }
}