@charset "UTF-8";
/*
Theme Name: おじさんレンタルテーマ
Template: keni71_wp_corp_blue_202511171643
Theme URI: http://www.seo-keni.jp/
Version: 7.1.0.10+
Author: 株式会社ウェブライダー
Author URI: http://www.web-rider.jp/

賢威7のテンプレート内のサンプル画像は、「フリー写真素材ぱくたそ」（※以降、「ぱくたそ」と表記します）の写真素材を利用しています。
賢威では「ぱくたそ」よりホームページテンプレート内でのサンプル画像としての使用許諾を得ていますが、これらのサンプル画像を継続してご利用する場合は、「ぱくたそ」公式サイトからご自身でダウンロードしていただくか、「ぱくたそ」のご利用規約（http://www.pakutaso.com/userpolicy.html）に必ず同意していただく必要があります。
*/
/* 共通 */
/* ここから子テーマ用CSSを記述 */
body {
  background-color: #ece9e4; /* サンプル: 背景色を白に */
}
/* メインボディーの幅 */
.main-body-in {
  width: 1280px !important;
}
/* 左カラムの幅 */
.main-conts {
  float: left;
  width: 70% !important;
}
/* 右カラムの幅 */
.sub-conts {
  float: right;
  width: 27% !important;
}
/* 共通、パンくずリスト */
.breadcrumbs-in {
  padding-top: 30px !important;
  font-size: 14px;
}

.h1title {
  background: transparent !important;
  border: none !important;
  padding: 5px 0 5px 30px !important;
  margin: 1px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important;
  font-weight: bold;
  color: #555 !important;
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}

.h1title::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
/* ==============================
   カスタムヘッダーのレイアウト
   ============================== */
/* 全体のヘッダー */
/* ヘッダーの土台：ロゴ・ナビ・ボタンを横一列に */
.custom-header {
  background-color: #ece9e4;
  border-bottom: 2px solid #ddd;
  padding: 20px 0;
  font-family: "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
/* 内側のレイアウト */
.header-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap; /* ← これ追加 */
}
.main-nav {
  margin-left: auto;
  margin-right: 40px;
  flex-shrink: 0; /* ← 追加 */
}
.login-buttons {
  flex-shrink: 0; /* ← 追加 */
}
/* ロゴエリア */
.logo-area {
  flex-shrink: 0;
}
.logo-area img {
  height: 70px; /* デザインに合わせて調整してください */
  width: auto;
  display: block;
}
/* ナビゲーション：左側にオートマージンを入れて右に寄せる */
.main-nav {
  margin-left: auto; /*  */
  margin-right: 40px; /* 右側のボタンとの距離 */
}
.main-nav .nav-list {
  display: flex;
  gap: 20px; /* メニュー項目同士の隙間 */
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.main-nav .nav-list li a {
  text-decoration: none;
  color: #333;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding-bottom: 4px;
}
/* 下線の初期状態（透明で幅ゼロ） */
.main-nav .nav-list li a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0; /* 左端からスタート */
  width: 0; /* 最初は幅0 */
  height: 2px; /* 線の太さ */
  background-color: #e74c3c; /* 下線の色 */
  transition: width 0.3s ease; /* ★ここで「ひゅっ」という速度を調整 */
}
/* ホバーした時に幅を100%に伸ばす */
.main-nav .nav-list li a:hover::after {
  width: 100%; /* ホバー時に右に向かって伸びる */
}
/* 赤い下線（現在のページ） */
.main-nav .nav-list li.current-menu-item a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #e74c3c;
}
/* ログインボタンエリア */
.login-buttons {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.btn-login {
  display: inline-block;
  padding: 10px 20px;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  font-size: 15px;
  font-weight: bold;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  transition: all 0.3s ease;
}
/* おじさん・ユーザーで色を分ける場合（デザイン画参照） */
.btn-login.ojisan {
  background-color: #6b7b4d; /* オリーブ */
}
.btn-login.user {
  background-color: #a4a04d; /* ゴールド系（画像の色に合わせました） */
}
.btn-login:hover {
  opacity: 0.8;
  transform: translateY(-1px); /* 軽く浮き上がる演出 */
}
/*--------- FV周りのレイアウト ----------*/
/* ==============================
   ojisan slick 最小安定CSS
   ============================== */
.ojisan-slider-wrap {
  width: 100%;
  overflow: hidden;
}
.ojisan-slider {
  max-width: 1280px;
  margin: 0 auto;
  position: relative;
}
/* 画像サイズ */
.ojisan-slider img {
  width: 100%;
  max-width: 1280px;
  height: auto;
  display: block;
  margin: 0 auto;
}
/* dots 位置 */
.ojisan-slider .slick-dots {
  bottom: -30px;
}
.ojisan-slider .slick-dots li button:before {
  color: #333;
  opacity: 0.5;
  font-size: 12px;
}
.ojisan-slider .slick-dots li.slick-active button:before {
  opacity: 1;
}
/* SP */
@media (max-width: 768px) {
  .ojisan-slider img {
    max-width: 100%;
    height: auto;
  }
  .ojisan-slider .slick-dots {
    bottom: -18px;
  }
}
/*--------- 検索セクション全体 ----------*/
/* 共通設定 */
h1#search.search_title {
  margin: 20px;
  background: none;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
}
.searchbox {
  background-color: #3d4035;
  padding: 30px 0px;
  color: #fff;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-size: 1.1rem;
  width: 1280px;
  max-width: 100%;
  margin: 30px auto 50px;
}
.ojisan-search-row {
  display: flex;
  justify-content: center;
  gap: 15px;
  max-width: 1000px;
  margin: 0 auto 30px;
}
/* ラベル位置を画像に合わせる */
.ojisan-search-item label {
  display: block;
  margin-bottom: 10px;
  font-size: 16px;
}
/* セレクトボックスの囲い */
.select-wrap {
  position: relative;
  height: 50px;
}
.select-wrap select {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 4px;
  padding: 0 50px 0 15px;
  appearance: none;
  -webkit-appearance: none;
  font-size: 16px;
  cursor: pointer;
  color: #3d4035;
}
/* 矢印（ボックスの中に綺麗に収める） */
.select-wrap::after {
  content: "▼";
  position: absolute;
  top: 0;
  right: 0;
  width: 45px;
  height: 50px; /* selectの高さと一致させる */
  background-color: #a4a04d;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0 4px 4px 0;
  pointer-events: none;
  font-size: 12px;
}
/* 検索ボタン */
.ojisan-search-button {
  width: 100%;
  height: 50px;
  margin-top: 34px; /* 上のラベルの高さ分下げる */
  background-color: #7b7d3d;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 18px;
  cursor: pointer;
}
/* 繋がり方を選ぶボタン形式 */
.ojisan-connect-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
}
.btn-check input[type="checkbox"] {
  display: none; /* 本物のチェックボックスを隠す */
}
.btn-check .btn-text {
  display: inline-block;
  background-color: #6d6d4e;
  padding: 6px 20px;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  color: #fff;
  transition: background 0.2s;
}
/* 繋がり方のテキスト（ボタン部分） */
.btn-check .btn-text {
  display: inline-block;
  background-color: #6d6d4e;
  padding: 6px 20px;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  color: #fff;
  /* ↓ここがポイント：0.3秒かけて変化させる設定 */
  transition: background-color 0.3s ease, opacity 0.3s ease;
}
/* マウスが乗ったとき（ホバー）の演出 */
.btn-check:hover .btn-text {
  background-color: #a4a04d; /* 矢印と同じ少し明るい金色に変化 */
  opacity: 0.9; /* ほんの少し透明度を下げて質感を出す */
}
/* チェックされた時の色（お好みで） */
.btn-check input[type="checkbox"]:checked + .btn-text {
  background-color: #a4a04d;
}
/* front-page.phpのレイアウト */
.toppage-title .is-top /* スマホ対応 */
@media (max-width: 768px) {
  .ojisan-search-row {
    flex-direction: column;
    gap: 25px;
  }
  .ojisan-connect-row {
    flex-wrap: wrap;
  }
}
/*--------- 右サイドメニュー・バーのレイアウト ----------*/
.sidebar-button {
  display: block;
  background: #5d6b41;
  color: #fff;
  padding: 18px;
  text-align: center;
  margin-bottom: 12px;
  text-decoration: none;
  font-weight: bold;
  border-radius: 3px;
  font-family: '游明朝', 'Yu Mincho', 'ヒラギノ明朝 ProN', serif;
}
.sidebar-button.user-button {
  background: #8b8a4d;
}
h3.ojisan-side-menu {
  display: block;
  background: #5d6b41;
  color: #fff;
  padding: 18px !important;
  text-align: center;
  margin: 0px 1px -1px !important;
  text-decoration: none;
  font-weight: bold;
  border-radius: 3px;
  font-family: '游明朝', 'Yu Mincho', 'ヒラギノ明朝 ProN', serif;
  font-size: 1.1em !important;
}
h3.ojisan-side-menu::after {
  display: none !important; /* 疑似要素を非表示 */
}
/*--------- トップページおじさん一覧 ----------*/
.toppage-title.is-top {
  background: transparent !important;
  border: none !important;
  padding: 5px 0 5px 30px !important;
  margin: 1px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important;
  font-weight: bold;
  color: #555 !important;
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.toppage-title.is-top::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
.ojisan-list-container {
  width: 100%;
  height: auto;
  margin: 0px auto 30px;
  padding-bottom: 20px;
}
/* カードリストの親 */
.ojisan-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin-left: 0px !important;
}
/* カード本体 */
.ojisan-card {
  position: relative; /* 子要素の絶対配置の基準にする */
  width: calc(33.333% - 14px);
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
/* 画像コンテナ */
.ojisan-image {
  position: relative; /* ステータスタグを上に乗せるため */
  width: 100%;
  aspect-ratio: 1 / 1; /* 正方形にする（お好みで） */
}
.ojisan-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 画像の上のステータスタグ（左上） */
.status-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #f39c12; /* オレンジ系（画像のイメージ） */
  color: #fff;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: bold;
  z-index: 2;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
/* 情報エリア */
.ojisan-info {
  padding: 15px;
  text-align: left;
}
/* おじさん一覧・アーカイブ */
.ojisan-info a {
  text-decoration: none !important;
}
.ojisan-desc_1 {
  font-size: 15px;
  color: #595959;
}
.ojisan-card-title {
  font-size: 0.8rem !important;
  font-weight: bold !important;
  margin: 0 0 10px !important;
  color: #595959;
  border-bottom-width: 2px !important;
  border-bottom-style: solid !important;
  border-bottom-color: #777 !important;
}
.ojisan-card-title::after {
  bottom: -2px !important;
  height: 2px !important;
  background-color: #e97653 !important;
}
.ojisan-meta {
  font-size: 0.8rem;
  color: #477333; /* テーマカラーの緑 */
  margin-bottom: 15px;
  font-weight: bold;
}
/* 詳細を見るボタン */
.btn-detail {
  display: block;
  background-color: #f39c12; /* オレンジ */
  color: #fff !important;
  text-align: center;
  padding: 8px 0;
  border-radius: 5px;
  text-decoration: none;
  font-size: 0.9rem;
  transition: opacity 0.3s;
  background: #6b7b4d !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
}
.btn-detail:hover {
  opacity: 0.8;
}
/* スマホ対応：1列にする */
@media (max-width: 768px) {
  .ojisan-card {
    width: calc(50% - 14px);
  }
}
/* 外枠のコンテナ */
.intro-box {
  position: relative;
  max-width: 900px; /* お好みの幅に調整してください */
  margin: 40px auto;
  padding-bottom: 30px; /* キャラクターがはみ出す分の余白 */
}
/* 白いテキストボックス */
.intro-content {
  background: #fff;
  padding: 50px 40px;
  border-radius: 5px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  text-align: center;
  line-height: 2;
  color: #333;
  font-size: 16px;
  margin-bottom: 60px;
}
/* キャラクターの配置 */
.intro-character {
  position: absolute;
  right: -75px;
  bottom: 51px;
  width: 300px;
  z-index: 10;
}
.intro-character img {
  width: 100%;
  height: auto;
  display: block;
}
/* スマホ表示の調整 */
@media screen and (max-width: 768px) {
  .intro-content {
    padding: 40px 20px;
    font-size: 14px;
  }
  .intro-character {
    width: 120px; /* スマホでは少し小さく */
    right: 0;
  }
}
/* =========================
   新着情報 全体
========================= */
.news-section {
  margin-top: 60px;
}
/* トップページ 新着情報：タイトルのズレ防止 */
.news-section .news-item:first-child .news-title {
  margin-top: 8px !important;
}
/* 白いボックス */
.news-container {
  max-width: 900px;
  margin: 0 auto;
  background: #fff;
  padding: 40px;
  position: relative; /* ボタンの配置基準 */
  border-radius: 4px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
.news-head {
  font-size: 24px;
  margin-bottom: 20px;
  font-weight: bold;
  color: #333;
}
.news-list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid #eee;
}
/* =========================
   各記事アイテム
========================= */
/* 各行の設定 */
.news-item {
  border-bottom: 1px solid #eee;
}
.news-item.odd {
  border-bottom: 1px dotted #000 !important; /* 一括指定で上書き */
  border-bottom-width: 1px !important; /* 個別にも念押し */
  border-bottom-style: dotted !important; /* 点線を念押し */
  border-bottom-color: #000 !important; /* 黒を念押し */
  padding: 10px !important;
  padding: 10px !important;
}
/* ニュースタイトルの文字の大きさ */
.news-title {
  font-size: 1rem !important;
  font-weight: bold !important;
}
/* =========================
   抜粋文
========================= */
.news-excerpt {
  margin-top: 6px !important;
  font-size: 0.85rem !important;
  color: #666 !important;
  line-height: 1.6 !important;
}
/* =========================
   偶数行の背景（必要なら）
========================= */
/*.news-item:nth-child(even) a {
  background-color: #fcfcfc;
} */
/* 1行おきに背景色をつける（画像のような縞々）
.news-item:nth-child(even) {
  background-color: #f9f9f9;
} */
.news-item a {
  display: flex;
  gap: 20px;
  padding: 18px 20px;
  text-decoration: none;
  color: #636363;
  align-items: flex-start;
  transition: background-color 0.3s ease;
}
.news-item a:hover {
  background-color: #f7f7f7;
}
/* =========================
   テキスト（タイトル＋抜粋）
========================= */
.news-text {
  flex: 1;
}
.news-title {
  display: block;
  margin-top: 6px !important;
  color: #444;
  line-height: 1.4;
  transition: color 0.3s ease;
}
.news-item a:hover .news-title {
  color: #cc5f35; /* アクセントカラー */
}
/* 「もっと見る」ボタン（右寄せ） */
.news-more {
  text-align: right;
  margin-top: 20px;
}
.news-more a {
  display: inline-block;
  background-color: #5d633a; /* 画像の濃い緑色 */
  color: #fff;
  padding: 10px 40px 10px 25px;
  text-decoration: none;
  font-size: 14px;
  position: relative;
  border-radius: 2px;
  transition: opacity 0.3s;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
}
/* ボタン内の三角アイコン */
.news-more a::after {
  content: '';
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  border-left: 6px solid #fff;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
.news-more a:hover {
  opacity: 0.8;
}
/* スマホ対応 */
@media screen and (max-width: 768px) {
  .news-container {
    padding: 20px;
  }
  .news-item a {
    flex-direction: column;
    gap: 8px;
  }
  .news-date {
    width: auto;
    font-size: 0.8rem;
  }
  .news-more {
    text-align: center; /* スマホでは中央寄せ */
  }
}
/* =========================
   新着情報 共通
========================= */
.news-archive, .news-single {
  line-height: 1.8;
}
.news-archive a, .news-single a {
  text-decoration: none;
}
.news-archive a:hover, .news-single a:hover {
  text-decoration: underline;
}
/* =========================
   新着情報一覧（アーカイブ）
========================= */
.news-archive .news-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}
.news-archive .news-card {
  background: #fff;
  border: 1px solid #eee;
  padding: 18px;
  transition: box-shadow 0.3s ease;
  border-radius: 4px;
}
.news-archive .news-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.news-archive .news-date {
  font-size: 13px;
  color: #888;
  display: block;
  margin-bottom: 6px;
}
.news-archive .news-title {
  font-size: 16px !important;
  margin-bottom: 10px;
  box-shadow: none;
}
.news-archive .news-excerpt {
  font-size: 14px;
  color: #555;
}
.news-archive .news-title a {
  color: #666;
  transition: color 0.3s ease, transform 0.3s ease;
}
.news-archive .news-title a:hover {
  color: #3770ad;
  transform: translateY(-2px);
}
/* archiveサムネイル中央寄せ */
.news-thumb {
  float: none !important;
}
.news-thumb img {
  margin: 0 auto !important;
  display: block !important;
}
/* アイキャッチ完全無効（保険） 
.news-archive img.wp-post-image,
.news-archive .post-thumbnail,
.news-archive .eyecatch {
  display: none !important;
}*/
/* =========================
   ページネーション
========================= */
.news-pagination {
  margin-top: 40px;
  text-align: center;
}
.news-pagination ul {
  display: inline-flex;
  gap: 8px;
  list-style: none;
  padding: 0;
}
.news-pagination li a, .news-pagination li span {
  padding: 8px 12px;
  border: 1px solid #ccc;
  font-size: 14px;
}
.news-pagination .current {
  background: #333;
  color: #fff;
}
.news-header {
  margin-bottom: 24px;
}
.news-title-single {
  background: transparent !important;
  border: none !important;
  padding: 5px 0 5px 30px !important;
  margin: 1px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important;
  font-weight: bold;
  color: #555 !important;
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.news-title-single::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
/* =========================
   新着情報 個別（1カラム）
========================= */
.news-single.one-column {
  max-width: 980px !important;
  margin: 0 auto !important;
  float: none !important;
}
/*  記事単体のカード感アップ */
.news-article {
  background: #fafafb;
  border-radius: 5px;
  padding: 32px 26px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.news-article:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}
/* 見出しと本文の余白整理 */
.news-article .news-header {
  margin-bottom: 24px;
}
/* 本文内部コンテンツも余白を整える */
.news-content-single p {
  margin-bottom: 1.8em;
  line-height: 1.8;
  color: #444;
}
/* 最後の余白調整 */
.news-article:last-child {
  margin-bottom: 0;
}
/* サイドバー完全非表示 */
.news-single.one-column + aside, .news-single.one-column ~ aside {
  display: none !important;
}
.news-thumb-single {
  margin-bottom: 20px;
}
.news-thumb-single img {
  width: 80%;
  height: auto;
  margin: 0 auto;
  display: block;
  border-radius: 5px; /* 角丸 */
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); /* 影 */
}
/* メタ情報 */
.news-meta {
  font-size: 14px;
  color: #777;
}
.news-category-single {
  margin-left: 10px;
  padding: 3px 10px;
  background: #f0f0f0;
  border-radius: 3px;
  font-size: 12px;
}
/* 本文 */
.news-content-single {
  font-size: 16px;
  color: #333;
}
.news-content-single p {
  margin-bottom: 1.5em;
}
/* =========================
   関連記事
========================= */
.news-related {
  margin-top: 60px;
  padding-top: 30px;
  border-top: 1px solid #ddd;
}
.news-related-title {
  font-size: 22px;
  margin-bottom: 15px;
}
.news-related-list {
  list-style: none;
  padding: 0;
}
.news-related-list li {
  margin-bottom: 10px;
}
.news-related-date {
  margin-right: 8px;
  font-size: 12px;
  color: #999;
}
/* カテゴリ色分け */
.news-category {
  display: inline-block;
  margin: 6px 0 10px;
  padding: 3px 10px;
  font-size: 12px;
  border-radius: 3px;
  color: #fff;
  line-height: 1.4;
}
/* お知らせ */
.cat-information {
  background-color: #3770ad;
}
/* イベント */
.cat-event {
  background-color: #cc5f35;
}
/* メディア掲載 */
.cat-media {
  background-color: #5a8f7b;
}
/* アップデート */
.cat-update {
  background-color: #666;
}
/* スマートフォン */
@media (max-width: 768px) {
  .news-title-single {
    font-size: 22px;
  }
  .news-archive .news-cards {
    grid-template-columns: 1fr;
  }
  /*--------- 個別記事周り ----------*/
  .news-article {
    padding: 24px 16px;
  }
}
/* =========================
 taxonomy-news_category  
========================= */
.archive-title {
  background: transparent !important;
  border: none !important;
  padding: 5px 0 5px 30px !important;
  margin: 1px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important;
  font-weight: bold;
  color: #555 !important;
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.archive-title::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
/* =========================
   下層ページ 共通
========================= */
/*--------- 安心安全への取り組み・利用規約・プライバシーポリシー・会社情報共通テンプレート ----------*/
.page-onecolumn .main-conts {
  max-width: 860px;
  margin: 0 auto;
}
.page-onecolumn .article-body {
  font-size: 15px;
  line-height: 1.9;
  color: #444;
}
.page-onecolumn h2 {
  margin-top: 2.5em !important;
  background: #cc5f35 !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
}
.page-onecolumn h3 {
  padding: 6px 16px !important;
  border-left: 4px solid #5d6b41;
  border-bottom: none !important;
  font-size: 1.2rem !important;
}
.page-onecolumn h3::after {
  position: absolute;
  z-index: 2;
  left: 0;
  bottom: -4px;
  width: 20%;
  height: 4px;
  background-color: #ece9e4 !important;
  content: '';
}
/* =========================
  固定ページ（1カラム） H1
========================= */
hr {
  border: none; /* デフォルトの線を消す */
  height: 1px !important;
  background-color: #cc5f35;
  margin: 30px 0;
}
.page-onecolumn .section-title {
  background: transparent !important;
  border: none !important;
  padding: 5px 0 5px 30px !important;
  margin: 1px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important;
  font-weight: bold;
  color: #555 !important;
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.page-onecolumn .section-title::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
.section-wrap {
  border: none !important;
}
@media (max-width: 768px) {
  .page-onecolumn .entry-content {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
/*--------- カスタム投稿おじさんプロフィールレイアウト ----------*/
/* -----------------------------------------------------------
 * おじさん個別ページ専用 (single-ojisan) の見出し装飾
 * ----------------------------------------------------------- */
/* 1. H1（名前部分）の装飾：*/
.single-ojisan .main-conts .section-title {
  background: transparent !important; /* 賢威の背景色を消す */
  border: none !important; /* 賢威の線を消す */
  padding: 5px 0 5px 30px !important; /* 左側に線の分の余白を作る */
  margin: 20px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important; /* 文字の大きさ（お好みで調整） */
  font-weight: bold;
  color: #555 !important; /* 少し柔らかい黒 */
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* 左側の太いオレンジ色の線 */
.single-ojisan .main-conts .section-title::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
/* 2. H2（自己紹介など）の装飾：吹き出し風・タグ風 */
/* 一旦デフォルトの装飾を消して、まっさらな状態にする */
.single-ojisan .sub-title {
  position: relative;
  text-align: center;
  border: none !important; /* 賢威の枠線を消す */
  background: none !important; /* 賢威の背景色を消す */
  padding: 0 0 15px 0 !important; /* 下側の余白だけ確保 */
  margin: 40px auto 30px !important;
  display: block; /* 幅をしっかり持たせる */
  width: 100%;
  box-shadow: none !important;
  color: #504f4e !important;
  font-size: 1.5rem !important;
  font-weight: bold;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* 中央の線を表示させる */
.single-ojisan .sub-title::before {
  content: "" !important; /* これがないと表示されません */
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  border-radius: 2px;
  display: block !important;
  background: #6b7b4d !important;
}
/* -----------------------------------------------------------
 * おじさん個別ページ：レイアウト・ラベルデザイン
 * ----------------------------------------------------------- */
/* おじさん専用のページ外枠（section-wrapの影響を打ち消して上書き） */
.ojisan-article-container.section-wrap {
  border: 1px solid #ece9e4 !important; /* 枠線を専用のデザインに */
  padding: 35px !important; /* 余白をたっぷり取る */
  border-radius: 6px !important; /* 全体的に角を丸くして優しく */
  box-shadow: none !important; /* 賢威の影を消す */
  max-width: 900px; /* プロフィールが見やすい幅に絞る */
  margin: 0 auto 40px; /* 中央に寄せる */
}
/* ついでに中の余白も調整 */
.ojisan-article-container .section-in {
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
/* 上部セクション（画像と表）の横並び */
.ojisan-upper-section {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin-bottom: 40px;
}
/* 画像コンテナ（ラベルを重ねるための基準点） */
.ojisan-image-container {
  position: relative;
  flex: 0 0 350px; /* 画像の幅 */
  max-width: 100%;
  text-align: center;
}
.ojisan-image-container img {
  width: 61%;
  height: auto;
  border-radius: 8px; /* 角を少し丸く */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
/* 画像に重ねるラベル（右上のステータス） */
.ojisan-label.status-label {
  position: absolute;
  top: 15px;
  right: 20%;
  background: #a4a04d;
  color: #fff;
  padding: 5px 15px;
  font-weight: bold;
  border-radius: 15px;
  font-size: 0.9em;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
/* サポート内容のバッジデザイ*/
.support-badge {
  display: inline-block;
  padding: 3px 12px;
  margin-right: 5px;
  margin-bottom: 5px;
  border-radius: 8px;
  font-size: 0.85em;
  border: 1px solid transparent;
}
/* 「話を聞いてほしい（スラッグ: talk）」のデザイン */
.support-badge.badge-talk {
  background-color: #cc5f35; /* 薄いピンク */
  color: #fff;
  border-color: #cc5f35;
}
/* 「相談（スラッグ: soudan）」のデザイン */
.support-badge.badge-soudan {
  background-color: #a4a04d;
  color: #fff;
  border-color: #a4a04d;
}
/* 「作業（スラッグ: work）」のデザイン */
.support-badge.badge-work {
  background-color: #6b7b4d;
  color: #fff;
  border-color: #6b7b4d;
}
/* プロフィール表のデザイン */
.ojisan-profile-data {
  flex: 1;
  min-width: 300px;
  color: #555;
  font-size: 15px;
}
.profile-table {
  width: 95%;
  border-collapse: collapse;
  border-top: none;
  border-left: none;
  margin: 0 auto;
}
.profile-table th {
  width: 30%;
  background-color: #a4a04d;
  padding: 12px 15px;
  border-bottom: 1px solid #fdfaf5;
  text-align: left;
  color: #fff;
  font-size: 0.95em;
}
.profile-table td {
  padding: 12px 15px;
  border-bottom: 1px solid #fdfaf5;
  border-right: 1px solid #ece9e4;
  color: #333;
}
.profile-table td strong {
  color: #d35400; /* 料金を強調 */
  font-size: 1.1em;
}
/* キャッチコピー */
.ojisan-catchcopy {
  font-size: 1.25em;
  font-weight: bold;
  color: #d35400;
  margin: 10px 0 20px;
  padding-left: 10px;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  text-align: center;
}
/* 自己紹介エリア */
.ojisan-content {
  line-height: 1.8;
  background: #fff;
  padding: 20px;
  border: 1px solid #eee;
  border-radius: 5px;
  color: #555;
  font-size: 15px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
/* お問い合わせエリア全体の装飾 */
.ojisan-contact-section {
  margin-top: 50px;
  padding: 30px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 5px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
.contact-intro {
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 25px;
  color: #555;
}
/* レンタルボタン（仮） */
.btn-rent {
  display: inline-block;
  background: #e67e22;
  color: #fff !important;
  padding: 15px 50px;
  font-size: 1.2rem;
  font-weight: bold;
  text-decoration: none;
  border-radius: 5px;
  transition: 0.3s;
  box-shadow: 0 4px 0 #b35d10;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.btn-rent:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0 #b35d10;
  opacity: 0.9;
}
/* スマホ対応 */
@media screen and (max-width: 768px) {
  .ojisan-upper-section {
    flex-direction: column;
  }
  .ojisan-image-container {
    flex: 0 0 auto;
    width: 100%;
  }
}
/* -----------------------------------------------------------
 * リクエスト個別ページ：レイアウト・ラベルデザイン
 * ----------------------------------------------------------- */
#request-title {
  background: transparent !important; /* 賢威の背景色を消す */
  border: none !important; /* 賢威の線を消す */
  padding: 5px 0 5px 30px !important; /* 左側に線の分の余白を作る */
  margin: 20px 0 40px 0 !important;
  position: relative;
  font-size: 28px !important; /* 文字の大きさ（お好みで調整） */
  font-weight: bold;
  color: #555 !important; /* 少し柔らかい黒 */
  padding: 1.5rem;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* 左側の太いオレンジ色の線 */
#request-title::before {
  position: absolute;
  bottom: -8px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #cc5f35;
}
h2.page-onecolumn {
  margin-top: 0.8em !important;
  background: #cc5f35 !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
}
.request-list-single {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
/* —— タイトルエリア —— */
.article-header .section-title {
  font-size: 26px;
  font-weight: bold;
  margin-bottom: 6px;
}
.request-meta {
  margin-top: 8px;
  font-size: 14px;
  color: #666;
}
.request-meta .meta-item {
  background: #f0f0f0;
  padding: 4px 8px;
  border-radius: 4px;
  margin-right: 8px;
}
/* —— レンタルリクエスト（画像＋コメント） —— */
.request-list-single {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
  padding: 15px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
}
.request-list-single img {
  width: 70px;
  height: 70px;
  object-fit: cover;
  border-radius: 50%;
}
.request-list-single p {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
}
/* —— 固定文章 —— */
.request-content {
  background: #fafafa;
  padding: 24px;
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  margin-bottom: 30px;
}
.request-content h2 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 12px;
}
.request-content p {
  margin-bottom: 10px;
  line-height: 1.7;
  color: #444;
}
.request-content ul {
  padding-left: 20px;
  margin: 12px 0;
}
.request-content ul li {
  margin-bottom: 6px;
  font-size: 15px;
}
/* -----------------------------------------------------------
 * おじさん登録ページレイアウト
 * ----------------------------------------------------------- */
/* ─────────────────────────
   全体背景とコンテナ
──────────────────────── */
/* 登録ページのタイトル（中央寄せ・下線アクセント） */
h1.main-conts_touroku {
    display: block; /* 幅いっぱいに広げる */
    text-align: center; /* テキストを中央へ */
    background: transparent !important;
    border: none !important;
    margin: 20px 0 40px 0 !important;
    padding: 1.5rem 0 !important; /* 左右のパディングを外して中央を出しやすく */
    position: relative;
    font-size: 28px !important;
    font-weight: bold;
    color: #555 !important;
    font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* タイトルの下の装飾線 */
h1.main-conts_touroku::before {
    position: absolute;
    bottom: 0; /* 位置を少し調整 */
    left: 50%;
    transform: translateX(-50%); /* 完全に中央へ配置 */
    width: 60px;
    height: 3px;
    content: '';
    border-radius: 3px;
    background: #cc5f35;
}
.main-conts_touroku {
  max-width: 100% !important;
  margin: 0 auto;
  margin-bottom: 0px;
}
/*.register-page {
  background-color: #f7f4ef; /* やわらかいベージュ背景 
  padding: 40px 0;
} */
.register-page .register-form {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 30px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  font-family: "Noto Sans JP", sans-serif;
}
.required-ojisan {
  color: #fff;
  font-size: 0.85rem;
  margin-left: 6px;
  background: #C81919;
  padding: 2px 6px;
  border-radius: 4px;
}
/* ─────────────────────────
   セクション見出し
──────────────────────── */
.register-page .register-form h1, .register-page .register-form h2 {
  color: #3a3a3a;
  font-weight: 700;
}
.register-page .register-form h1 {
  text-align: center;
  font-size: 1.9rem;
  margin-bottom: 25px;
}
.register-page .register-form h2 {
  font-size: 1.3rem;
  margin-top: 25px;
  border-bottom: 2px solid #e0d9cf;
  padding-bottom: 6px;
}
/* ─────────────────────────
   ラベル・テキスト
──────────────────────── */
.register-page .register-form label {
  display: block;
  font-size: 1rem;
  margin-top: 18px;
  color: #555;
  font-weight: 500;
}
.register-form input:hover, .register-form textarea:hover {
  border-color: #c9b8a6;
}
/* ─────────────────────────
   入力欄
──────────────────────── */
.register-page .register-form input[type="text"], .register-page .register-form input[type="email"], .register-page .register-form input[type="tel"], .register-page .register-form textarea {
  width: 97%;
  padding: 12px 14px;
  border: 1.8px solid #d7cfc4;
  border-radius: 6px;
  font-size: 1rem;
  margin-top: 6px;
  background: #faf9f7;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.register-form input[type="password"] {
  width: 35%;
  padding: 12px 14px;
  border: 1.8px solid #d7cfc4;
  border-radius: 6px;
  font-size: 1rem;
  margin-top: 6px;
  background: #faf9f7;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.register-page .register-form input:focus, .register-page .register-form textarea:focus {
  border-color: #bdb0a3;
  box-shadow: 0 0 8px rgba(189, 176, 163, 0.2);
  outline: none;
}
/* ─────────────────────────
   プレースホルダー
──────────────────────── */
.register-page .register-form input::placeholder, .register-page .register-form textarea::placeholder {
  color: #aaa;
  font-style: italic;
}
/* ─────────────────────────
   同意チェック
──────────────────────── */
.register-page .register-form .agree {
  margin-top: 20px;
  font-size: 0.95rem;
  color: #444;
}
.register-page .register-form .agree input {
  margin-right: 8px;
}
/* ─────────────────────────
   送信ボタン
──────────────────────── */
.register-page .register-form button {
  display: block;
  width: 70%;
  background-color: #b61515;
  color: #fff;
  border: none;
  padding: 14px 0;
  font-size: 1.1rem;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
  margin-top: 26px;
  transition: background-color 0.25s ease;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  margin: 26px auto;
}
.register-page .register-form button:hover {
  background-color: #b17979;
}
/* ─────────────────────────
   スマホ対応
──────────────────────── */
@media (max-width: 600px) {
  .register-page .register-form {
    padding: 26px 18px;
  }
  .register-page .register-form h1 {
    font-size: 1.6rem;
  }
}
/* ================================
   おじさんマイページ用スタイル
   ================================ */
.main-conts_ojisan-my-page {
  max-width: 700px;
  margin: 0 auto 50px auto;
  padding: 40px 20px;
  background-color: #f9f9f9;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}
.main-conts_touroku h1 {
  font-size: 28px;
  margin-bottom: 30px;
  text-align: center;
  color: #333;
}
.main-conts_ojisan-my-page form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.main-conts_ojisan-my-page label {
  font-weight: 600;
  margin-bottom: 5px;
  display: block;
  color: #555;
}
.main-conts_ojisan-my-page input[type="text"], .main-conts_ojisan-my-page input[type="email"], .main-conts_ojisan-my-page input[type="tel"], .main-conts_ojisan-my-page textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 15px;
  color: #333;
  box-sizing: border-box;
}
.main-conts_ojisan-my-page input[type="number"] {
  width: 30%;
  padding: 10px 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 15px;
  color: #333;
  box-sizing: border-box;
}
.main-conts_ojisan-my-page textarea {
  min-height: 100px;
  resize: vertical;
}
h3.taikai {
  font-size: 1rem !important;
  border-left: none;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  padding: 1px 1px !important;
  color: #bc2b2b;
}
#taikai-txt {
  font-size: 0.85em;
  color: #666;
  margin-bottom: 15px;
}
/* ボタンを2列に並べるコンテナ */
.button-group {
  display: flex;
  gap: 15px; /* ボタン間の隙間 */
  margin-bottom: 30px;
}
/* 各要素を均等な幅にする（またはお好みで調整） */
.save-btn, .delete-form {
  flex: 1;
}
/* マイページに戻るリンクエリア */
.back-link-area {
  text-align: center;
  margin-top: 40px;
}
/* ボタン共通設定 */
.save-btn, .delete-btn, .btn-back {
  display: inline-block;
  padding: 15px 30px;
  border-radius: 5px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: 0.3s;
  border: none;
  font-size: 16px;
}
/* 保存ボタン：青 */
.save-btn {
  background: #3770ad;
  color: #fff !important;
  width: 100%; /* メインアクションなので幅広 */
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.save-btn:hover {
  background: #3770ad;
}
/* 退会ボタン：赤（枠線のみの控えめな赤） */
.delete-btn {
  background: #fff;
  color: #fff !important;
  border: 1px solid #e74c3c;
  width: 100%;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.delete-btn:hover {
  background: #e74c3c;
  color: #fff !important;
}
/* 戻るボタン：グレー */
.btn-back {
  background: #95a5a6;
  color: #fff !important;
  min-width: 200px;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.btn-back:hover {
  background: #7f8c8d;
}
/* スマホ対応 */
@media screen and (max-width: 767px) {
  .delete-btn, .btn-back {
    width: 100%;
  }
}
.taikai-text h3 {
  font-size: 1em;
  color: #999;
  margin-bottom: 5px;
}
.taikai-text p {
  font-size: 0.8em;
  color: #666;
}
/* 新規登録誘導エリアのコンテナ */
.registration-link-box {
  margin-top: 3rem; /* 上部の余白 */
  padding-top: 2rem; /* 線との間の余白 */
  text-align: center; /* 中央寄せ */
  border-top: 1px solid #ccc; /* 区切り線 */
}
/* 案内テキスト */
.registration-text {
  margin-bottom: 1.5rem;
  font-weight: bold;
  font-size: 1.1rem;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* 新規登録ボタン */
.btn-registration {
  display: inline-block;
  padding: 0.8rem 2.5rem;
  background-color: #D56417;
  color: #ffffff;
  text-decoration: none;
  border-radius: 5px;
  font-weight: bold;
  transition: background-color 0.3s ease, transform 0.2s ease;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  /* モバイル対応：画面が狭いときは幅いっぱいに広がる */
  width: auto;
  max-width: 100%;
}
/* ホバー時の挙動 */
.btn-registration:hover {
  background-color: #CC855B;
  color: #ffffff;
  text-decoration: none;
  transform: translateY(-2px); /* 軽く浮き上がる演出 */
}
.taikai-container {
  margin-top: 60px;
  padding: 20px;
  border: 1px dashed #ccc;
  background: #f9f9f9;
}
/* スマートフォン向けの微調整 */
@media (max-width: 480px) {
  .btn-registration {
    width: 90%; /* 横幅いっぱいに近く */
    padding: 1rem 0; /* 押しやすい高さに */
  }
}
/* ================================
   おじさんプロフィールページ用スタイル
   ================================ */
/* ボタンを包むコンテナ */
.mypage-buttons {
  display: flex;
  gap: 1rem; /* 相対的な単位（16px相当）で隙間を指定 */
  flex-wrap: wrap;
  margin-top: 2rem;
}
/* ボタンの共通ベーススタイル */
.mypage-buttons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.5rem;
  text-decoration: none;
  border-radius: 5px;
  font-weight: bold;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  transition: all 0.25s ease;
  flex: 1; /* 横幅を均等に広げる（不要なら auto に） */
  min-width: 200px; /* スマホでボタンが細くなりすぎないように */
}
/* プロフィール編集ボタン */
.btn-edit {
  background-color: #3770ad;
  color: #fff;
  border: none;
}
.btn-edit:hover {
  background-color: #063c8d;
  opacity: 0.9;
  transform: translateY(-1px);
}
/* ログアウトボタン */
.btn-logout {
  background-color: #f5f5f5;
  color: #666;
  border: 1px solid #ccc;
}
.btn-logout:hover {
  background-color: #e0e0e0;
  color: #333;
}
/* スマホ対応：幅が狭い時は縦に並べる（久恵さんのお好みで） */
@media (max-width: 480px) {
  .mypage-buttons {
    flex-direction: column;
  }
  .mypage-buttons a {
    width: 100%;
  }
}
/* スマホ表示（幅が狭い時）は1列に戻す */
@media (max-width: 600px) {
  .button-group {
    flex-direction: column;
  }
}
/* スマホ対応 */
@media (max-width: 768px) {
  .main-conts_ojisan-my-page {
    padding: 30px 15px;
  }
  .main-conts_ojisan-my-page h1 {
    font-size: 24px;
  }
}
/* ================================
   おじさんプロフィールスタイル
   ================================ */
#taikai {
  margin-top: 60px;
  padding: 20px;
  border: 1px solid #ffebeb;
  background: #fffafa;
  border-radius: 8px;
}
#taikai H3 {
  color: #e74c3c;
  font-size: 1em;
  margin-top: 0;
}
#taikai p {
  font-size: 0.8em;
  color: #666;
  margin-bottom: 10px;
}
/* 登録完了ページのカードスタイル、おじさん・ユーザー共通 */
.complete-card {
  max-width: 650px;
  margin: 3rem auto !important; /* 中央寄せ */
  padding: 3rem 2rem !important;
  background: #fff;
  border: 2px solid #f0f0f0;
  border-radius: 15px;
  text-align: center;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}
/* チェックアイコンの装飾 */
.complete-check-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background-color: #4caf50;
  color: #fff;
  font-size: 30px;
  border-radius: 50%;
  margin-bottom: 1.5rem;
}
/* タイトルの調整 */
h1.main-conts_touroku {
  font-size: 1.6rem !important;
  margin-bottom: 1.5rem !important;
  color: #333;
  border: none !important; /* 下線を消してスッキリ */
}
/* メッセージの調整 */
.complete-text {
  font-size: 1.1rem;
  line-height: 1.8;
  color: #555;
  margin-bottom: 2.5rem !important;
}
/* ボタンの装飾 */
.btn-login-custom {
  display: inline-block;
  background-color: #0073aa; /* サイトのメイン色 */
  color: #fff !important;
  padding: 1rem 3rem;
  border-radius: 50px;
  text-decoration: none;
  font-weight: bold;
  font-size: 1.1rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 115, 170, 0.2);
}
.btn-login-custom:hover {
  background-color: #005a87;
  transform: translateY(-3px);
  box-shadow: 0 6px 15px rgba(0, 115, 170, 0.3);
  text-decoration: none !important;
}
/* スマホ表示の最適化 */
@media (max-width: 768px) {
  .complete-card {
    margin: 2rem 1rem !important;
    padding: 2.5rem 1.5rem !important;
  }
  .complete-text {
    font-size: 1rem;
  }
  .btn-login-custom {
    width: 100%; /* スマホではボタンを横いっぱいに */
    box-sizing: border-box;
  }
}
/* -----------------------------------------------------------
 * お問い合わせフォームレイアウト
 * ----------------------------------------------------------- */
/* フォーム全体 */
.wpcf7 {
  max-width: 720px;
  margin: 0 auto;
}
/* 各項目 */
.wpcf7 p {
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.6;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
/* 入力欄共通 */
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 select, .wpcf7 textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  font-size: 14px;
  box-sizing: border-box;
}
/* テキストエリア */
.wpcf7 textarea {
  min-height: 160px;
  resize: vertical;
}
/* 送信ボタン */
.wpcf7 input[type="submit"] {
  width: 100%;
  padding: 14px;
  background-color: #8b6745;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.45s ease, transform 0.25s ease, box-shadow 0.25s ease;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* ホバー時 */
.wpcf7 input[type="submit"]:hover {
  background-color: #6f5137;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
/* エラーメッセージ */
.wpcf7-not-valid-tip {
  font-size: 12px;
}
/* 送信完了メッセージ */
.wpcf7-response-output {
  margin-top: 20px;
  padding: 14px;
  border-radius: 6px;
}
.required_ojisan {
  background: #e60023;
  color: #fff !important;
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: 6px;
}
.touroku {
  font-size: 0.8em;
  color: #666;
}
.required-ojitouroku {
  color: #fff !important;
  font-size: 0.85rem;
  margin-left: 6px;
  background: #d82424;
  padding: 2px 6px;
  border-radius: 4px;
}
/* 一般登録ページ内の「おじさん登録」誘導エリア */
.ojisan-guide {
  margin-top: 40px;
  padding: 20px;
  background-color: #f9f9f9;
  border: 2px dashed #ccc;
  text-align: center;
  border-radius: 10px;
}
.ojisan-guide__title {
  margin-bottom: 15px;
  font-weight: bold;
  color: #333;
}
.ojisan-guide__button {
  display: inline-block;
  background-color: #da8653;
  color: #fff !important; /* 賢威などのテーマ対策 */
  padding: 12px 25px;
  text-decoration: none;
  border-radius: 5px;
  font-weight: bold;
  transition: background-color 0.3s ease, opacity 0.3s ease;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
/* ホバー時の動き */
.ojisan-guide__button:hover {
  background-color: #994512;
  text-decoration: none;
  opacity: 0.9;
}
.ojisan-guide__note {
  margin-top: 10px;
  font-size: 0.85em;
  color: #888;
}
/* SP最適化 */
@media (max-width: 768px) {
  .wpcf7 {
    padding: 0 16px;
  }
}
/* -----------------------------------------------------------
 * 決済ページレイアウト
 * ----------------------------------------------------------- */
.payment-wrapper {
  max-width: 700px;
  margin: 40px auto;
  padding: 30px;
  background: #fff;
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  line-height: 1.8;
}
.payment-wrapper h2 {
  text-align: center;
  margin-bottom: 20px;
}
.payment-box {
  margin: 25px 0;
  padding: 20px;
  background: #f9f7f4;
  border-radius: 6px;
}
.payment-notes ul {
  padding-left: 20px;
}
.back-contact-btn {
  display: block;
  margin-top: 30px;
  padding: 14px;
  text-align: center;
  background: #8b6745;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
  transition: 0.4s ease;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: 500;
}
.back-contact-btn:hover {
  opacity: 0.8;
  transform: translateY(-2px);
}
/* フッター */
/*--------- フッター上コンテンツレイアウト ----------*/
.riyou-annsinbox {
  background-color: #cc5f35;
  height: 40px;
}
.anshin-riyou {
  margin: 0 auto;
  width: 980px;
  text-align: center;
  padding: 9px 0;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
#footer.site-footer {
  background: #41453d;
}
.footer-menu-wrap {
  display: flex;
  justify-content: space-between;
  background: #41453d;
  color: #fff;
  padding: 40px 20px;
  flex-wrap: wrap;
}
.footer-menu-column {
  flex: 1 1 30%;
  min-width: 200px;
  margin-bottom: 20px;
}
.footer-menu-title {
  font-size: 1.2rem;
  margin-bottom: 12px;
  border-bottom: 1px solid #555;
  padding-bottom: 6px;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.footer-menu-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-menu-list li {
  margin-bottom: 8px;
  list-style: none;
}
.footer-menu-list a {
  color: #fff;
  text-decoration: none;
  font-size: 0.95rem;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
}
.footer-menu-list a::before {
  content: "▶ ";
  margin-right: 4px;
  color: #f2b84b;
}
.footer-menu-list a:hover {
  text-decoration: underline;
}
/*--------- フッターコピーライト ----------*/
#backcolor {
  background-color: #ece9e4;
  color: #535353;
  padding: 9px 0;
  margin: 0;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  font-weight: bold;
  font-size: 0.9rem;
}
/*--------- ページトップへ戻る ----------*/
.page-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1000;
}
.page-top a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background-color: #3770ad;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  border-radius: 50%;
  text-decoration: none;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  transition: all 0.3s;
}
.page-top a:hover {
  background-color: #25538a;
  transform: translateY(-3px);
}

/* パスワード再発行フォームの外枠 */
#lostpasswordform {
    max-width: 500px;
    margin: 40px auto;
    padding: 30px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* 説明文のスタイル */
#lostpasswordform p {
    font-size: 15px;
    line-height: 1.6;
    color: #444;
    margin-bottom: 20px !important;
}

/* ラベルのスタイル */
#lostpasswordform label {
    display: block;
    font-weight: bold;
    margin-bottom: 8px;
    color: #333;
}

/* 入力フィールドのスタイル */
#lostpasswordform input[type="text"] {
    width: 100%;
    padding: 12px;
    font-size: 16px;
    border: 2px solid #eeeeee;
    border-radius: 4px;
    transition: border-color 0.3s;
    box-sizing: border-box; /* 枠線が外にはみ出ないように */
}

/* 入力フィールドにカーソルが入った時 */
#lostpasswordform input[type="text"]:focus {
    border-color: #0073aa; /* 賢威のアクセントカラーに合わせる */
    outline: none;
}

/* 送信ボタンのスタイル */
#lostpasswordform input[type="submit"] {
    width: 100%;
    background-color: #333; /* 落ち着いた黒 */
    color: #fff;
    padding: 14px;
    font-size: 16px;
    font-weight: bold;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* ボタンにマウスを乗せた時 */
#lostpasswordform input[type="submit"]:hover {
    background-color: #555;
}

/* 完了メッセージのスタイル */
.lostpassword-done-msg {
    max-width: 500px;
    margin: 20px auto;
    background: #e7f3ff;
    border-left: 5px solid #2196F3;
    padding: 15px;
    border-radius: 4px;
    color: #0d47a1;
}

/* 完了メッセージのボックス */
.lostpassword-done-msg {
    max-width: 500px;
    margin: 20px auto;
    padding: 20px;
    background-color: #f0f7ff; /* 薄い青 */
    border: 1px solid #bcdff1; /* 枠線 */
    border-left: 5px solid #2196F3; /* 左側のアクセント線 */
    border-radius: 4px;
    color: #31708f; /* 文字色 */
    font-size: 14px;
    line-height: 1.6;
}

/* メッセージ内の太字 */
.lostpassword-done-msg strong {
    color: #245269;
    font-size: 16px;
    display: block;
    margin-bottom: 5px;
}
/* パスワードをお忘れですか？ */
.password {
  text-align: center;
  font-size: 1em;
  color: #b63b3b;
}

.password a {
    color: #b63b3b;
}
/* =====================
   タブレット表示（1200px以下）
===================== */
@media (max-width: 1200px) {
  /* サイト全体の横揺れを物理的に止める */
  body {
    overflow-x: hidden !important;
    position: relative !important;
    width: 100% !important;
  }
  /* トップページ */
  /* headerメニューの幅 */
  .header-inner {
    width: 98% !important;
  }
  .main-nav .nav-list {
    display: block;
  }
  /* おじさんスライダーFVの幅*/
  .ojisan-slider {
    width: 100% !important;
  }
  /* main-body-inの幅 */
  .main-body-in {
    width: 98% !important;
  }
  /* おじさんカード一覧*/
  .ojisan-card {
    width: calc(50.333% - 14px);
  }
  /* おじさんカード一覧のimgのサイズ*/
  .ojisan-grid .attachment-medium.size-medium.wp-post-image {
    width: 100% !important;
  }
  /* 下層ページ（各ページ）のレイアウト*/
  .page-onecolumn .main-conts {
    width: 100% !important;
    margin: 0 auto;
    float: none;
  }
  .intro-character {
    right: -8rem;
    bottom: 3rem;
    width: 300px;
  }
  .intro-character img {
    width: 80%;
    height: auto;
    display: block;
  }
}
/* =====================
   1. 全画面共通：PCでは隠す
===================== */
.sp-menu-toggle, .sp-menu {
  display: none !important;
}
/* =====================
   2. スマホ表示（768px以下）
===================== */
@media (max-width: 768px) {
  /* サイト全体の横揺れを物理的に止める */
  body {
    overflow-x: hidden !important;
    position: relative !important;
    width: 100% !important;
  }
  /* Fvスライダー */
  .ojisan-slider img {
    max-width: 100%;
    height: auto;
  }
  .ojisan-slider-wrap {
    overflow: 0;
  }
  .ojisan-slider .slick-dots {
    bottom: 3px;
  }
  /* おじさんサーチ */
  .searchbox {
    max-width: 100%;
    margin: 4px auto 30px;
  }
  .searchbox_text {
    width: 95%;
    margin: 0 auto;
  }
  .ojisan-search-row {
    flex-direction: column;
    gap: 25px;
    max-width: 95%;
  }
  .ojisan-connect-row {
    flex-wrap: wrap;
    display: block;
  }
  .intro-content {
    padding: 40px 20px;
    font-size: 14px;
  }
  .intro-box {
    padding-bottom: 0 !important;
  }
  .intro-character {
    right: -6rem;
    bottom: -2rem;
  }
  .news-section {
    margin-top: 70px;
  }
  /* PCナビを消す */
  .main-nav, .login-buttons {
    display: none !important;
  }
  /* メニューの初期位置を固定 */
  /* ハンバーガーを表示（!importantで強制） */
  .header-inner .sp-menu-toggle {
    display: block !important;
    width: 42px !important;
    height: 35px !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 10001 !important;
    margin-left: auto !important;
    padding: 0 !important;
  }
  /* 3本線の見た目 */
  .sp-menu-toggle span {
    display: block !important;
    width: 30px !important;
    height: 3px !important;
    background-color: #333 !important;
    margin: 6px auto !important;
    transition: all 0.3s ease !important;
  }
  /* 【JS連動】×にする（!importantで強制） */
  /* 1. 三本線を「×」にする（bodyを付けて優先度を最大に） */
  body .sp-menu-toggle.open span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px) !important;
    background-color: #333 !important;
  }
  body .sp-menu-toggle.open span:nth-child(2) {
    opacity: 0 !important;
  }
  body .sp-menu-toggle.open span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px) !important;
    background-color: #333 !important;
  }
  /* SPメニュー本体（!importantで強制） */
  .header-inner .sp-menu {
    display: block !important;
    position: absolute !important;
    top: 7rem !important;
    right: -21rem !important;
    width: 280px !important;
    /* ★ここが超重要 */
    height: calc(100vh - 7rem) !important;
    background: #ece9e4cc;
    padding: 20px !important;
    box-shadow: -3px 0 10px rgba(0, 0, 0, 0.2) !important;
    transition: right 0.4s ease !important;
    z-index: 10000 !important;
    overflow-y: auto !important;
    /* ★iOSスクロール安定化 */
    -webkit-overflow-scrolling: touch;
  }
  /* 【JS連動】メニュー出現 */
  .header-inner .sp-menu.active {
    right: 0rem !important;
  }
  /* メニュー内レイアウト */
  /* メニュー内レイアウト */
  .sp-menu .nav-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
  .sp-menu .nav-list a {
    text-decoration: none !important;
    color: #333 !important;
    font-size: 16px !important;
    display: block !important;
  }
  .sp-menu .login-buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-top: 30px !important;
  }
  /* メインコンテンツの幅 */
  .main-body-in {
    width: 100% !important;
  }
  .main-conts {
    width: 99% !important;
    margin: 0 auto;
    float: none !important;
  }
  /* サイドバーの幅 */
  .sub-conts {
    width: 100% !important;
    margin-top: 30px;
    display: block;
  } /* トップページレイアウトここまで */
  /* カスタム投稿おじさんページ */
  .single-ojisan .sub-title {
    font-size: 1.3rem !important;
  }
  /* カスタム投稿おじさんページパンくずリスト */
  .breadcrumbs-in li:last-child {
    display: block !important;
  }
  .ojisan-article-container.section-wrap {
    padding: 0px !important;
  }
  .ojisan-grid {
    width: 98%;
    margin: 0 auto !important;
  }
  .ojisan-grid .attachment-medium.size-medium.wp-post-image {
    width: 100% !important;
  }
  .ojisan-image-container img {
    width: 80%;
  }
  .ojisan-label.status-label {
    top: 1rem;
    right: 2.5rem;
  }
  .profile-table {
    width: 98%;
  }
  .profile-table th {
    display: block;
    width: 90%;
  }
  .profile-table td {
    display: block;
  }
  /* 下層ページ レンタルしたいおじさんページh1文字のサイズ */
  #request-title {
    font-size: 1.2rem;
    padding-left: 5px !important;
  }
  #request-title::after {
    content: "\A";
    white-space: pre;
  }
  /* footer周り */
  .riyou-annsinbox {
    width: 100%;
  }
  .anshin-riyou {
    width: 100%;
    text-align: center;
    font-size: 0.9rem;
  }
  .copyright p {
    text-align: center;
  }
}
/* =====================
   3. スマホ表示（414px以下）
===================== */
@media (max-width: 414px) {
  /* headerメニュー高さ調整 */
  .header-inner .sp-menu {
    top: 7rem !important;
  }
  /* トップページ検索サーチBOX周り */
  .connect-title {
    font-size: 0.9rem;
  }
  /* おじさん一覧カード表示 */
  .ojisan-card {
    width: 100%;
  }
  /* トップページちょうど良い距離を大切にしていますコンテンツ画像の位置 */
  .intro-character {
    width: 41%;
    right: -2rem;
    bottom: -1rem;
  }
  .ojisan-connect-row {
    flex-wrap: wrap;
    display: inline-flex;
    gap: 2px;
  }
  .page-onecolumn .section-title {
    font-size: 23px !important;
  }
  /* 下層ページ レンタルしたいおじさんのページh2文字サイス */
  h2.page-onecolumn {
    font-size: 16px !important;
  }
}