/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 08 2026 | 04:52:04 */
/*===========================================
 * ブログ一覧トップ：はじめての方へ
 *==========================================*/
/* ===== ob-intro: final (minimal / text-like list) ===== */
.ob-intro {
  --ob-brand: rgba(74,61,102,.55); /* 左ライン：ブランド紫（気配） */
  --ob-sep: rgba(74,61,102,.08);
  --ob-hover: rgba(74,61,102,.02);
  --ob-text: #222;
  --ob-muted: #333;

  border: none;                 /* A：枠を消す */
  background: transparent;      /* A：背景も消す */
  border-radius: 0;
  padding: 8px 0 10px;          /* 文章の延長としての余白 */
  margin: 0 0 18px;
}

.ob-intro__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 6px;
}

/* 「はじめての方へ」バッジ（小さめ・控えめ） */
.ob-intro__badge {
  display: inline-flex;
  align-items: center;
  gap: .45em;
  font-size: 11px;
  line-height: 1;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(74,61,102,.10);
  color: var(--ob-muted);
  font-weight: 600;
  white-space: nowrap;
}
.ob-intro__badge::before {
  content: "";
  width: 8px;  /* 10px */
  height: 8px;  /* 10px */
  border-radius: 50%;
  background: var(--color-btn-bg-main);  /* トップページのサービス紹介と同じ */
  box-shadow: 0 0 0 2px rgb(var(--rgb-brand-accent) / 0.18);  /* トップページのサービス紹介と同じ */
  /* background: rgba(244,182,63,.9);      /* バッジの点はアクセント */
  /* box-shadow: 0 0 0 3px rgba(244,182,63,.20); */
  flex: 0 0 auto;
}

.ob-intro__title {
  margin: 0;
  font-size: 15px;
  line-height: 1.4;
  color: var(--ob-muted);        /* 見出しは濃いグレー（共通ルール） */
  font-weight: 700;
}

.ob-intro__desc {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.75;
  color: var(--ob-text);
  opacity: .92;
}

.ob-intro__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 文章寄りのリンク（カード感ゼロ） */
.ob-intro__item a {
  display: block;
  text-decoration: none;
  color: var(--ob-text);          /* リンク色をブランドにしない */
  padding: 12px 6px 12px 12px;
  position: relative;
  background: transparent;
}

/* 左のライン：唯一の視覚記号（2pxで上品に） */
.ob-intro__item a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 2px;
  border-radius: 99px;
  background: var(--ob-brand);
}

/* 区切り線だけ残す（箱ではなく“文章の区切り”） */
.ob-intro__item + .ob-intro__item a {
  border-top: 1px solid var(--ob-sep);
}

/* hoverは背景だけ（文字色は変えない） */
.ob-intro__item a:hover {
  background: var(--ob-hover);
}

.ob-intro__kicker {
  margin: 0 0 4px;
}

.ob-intro__label {
  font-size: 12px;
  color: var(--ob-muted);
  opacity: .95;
  font-weight: 600;
  letter-spacing: .03em;
}

.ob-intro__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ob-text);
  opacity: .95;
}

.ob-intro__note {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--ob-text);
  opacity: .65;
}

@media (max-width: 480px) {
  .ob-intro {
    padding: 8px 0 10px;
  }
  .ob-intro__title {
    font-size: 15px;
  }
}

/*===========================================
 * ブログ一覧トップ：カード
 *==========================================*/

 /* =========================
   Archive card title (text color hover)
   ========================= */

/* h2自体には何もしない（背景・角丸をやめる） */
body.blog h2.entry-title,
body.archive h2.entry-title {
  position: relative;
}

/* 通常時のタイトルリンク */
body.blog h2.entry-title a.entry-link,
body.archive h2.entry-title a.entry-link {
  color: inherit;              /* 通常は本文と同色 */
  text-decoration: none;
  transition: color .18s ease; /* 色だけ変化 */
}

/* hover / focus 時：文字色だけをさりげなく変える */
body.blog h2.entry-title a.entry-link:hover,
body.blog h2.entry-title a.entry-link:focus-visible,
body.archive h2.entry-title a.entry-link:hover,
body.archive h2.entry-title a.entry-link:focus-visible {
  color: rgba(74,61,102,.85);  /* ブランド紫を控えめに */
}

/* =========================
   Archive card read-more link
   ========================= */
body.blog p.read-more a.read-more-link,
body.archive p.read-more a.read-more-link {
  color: inherit;
  text-decoration: none;

  display: inline-flex;
  align-items: center;

  font-size: .88em;
  opacity: .72;
  transition: opacity .15s ease;
}

/* hover/focus */
body.blog p.read-more a.read-more-link:hover,
body.blog p.read-more a.read-more-link:focus-visible,
body.archive p.read-more a.read-more-link:hover,
body.archive p.read-more a.read-more-link:focus-visible {
  color: inherit !important;
  opacity: 1;
}

/* フォントアイコンを無効化 */
body.blog i.ico-angle-double-right::before,
body.archive i.ico-angle-double-right::before {
  content: none !important;
}

/* 代わりに CSS で矢印を出す */
body.blog p.read-more a.read-more-link::after,
body.archive p.read-more a.read-more-link::after {
  content: "»";
  margin-left: .35em;
  opacity: .75;
  transition: transform .15s ease, opacity .15s ease;
}

body.blog p.read-more a.read-more-link:hover::after,
body.archive p.read-more a.read-more-link:hover::after {
  transform: translateX(2px);
  opacity: 1;
}

/* アイキャッチ画像の外枠（ホバー時） */
.term img:hover {
  border: none;
}

/* =========================
   In-article links (no underline)
   ========================= */

/* 通常時：本文より少しだけ“色”を入れる */
.single-post .link-article a {
  text-decoration: none;
  color: color-mix(in srgb, currentColor 64%, #4A3D66 36%);
  font-weight: 600;
  opacity: .92;
}

/* hover/focus：気配だけ強める（色は大きく変えない） */
.single-post .link-article a:hover,
.single-post .link-article a:focus-visible {
  opacity: 1;
  color: color-mix(in srgb, currentColor 58%, #4A3D66 42%);
}

/*===========================================
 * カテゴリページ：説明文
 *==========================================*/
/* 背景と余白*/
div.category-description {
  background: inherit;
  padding-left: 15px;
}

div.category-description:hover {
  background: inherit;
}

/*===========================================
 * 記事ページ：h1サブタイトル
 *==========================================*/
/* 日付とサブタイトル間の余白 */
.single-post p.meta {
  margin-bottom: 1.2rem;
}

.single-post p.subtitle_h1 {
  margin-top: 1.2rem;
  color: var(--color-ink-weak);
}

/*===========================================
 * 記事ページ：見出しh2
 *==========================================*/
/* ブログ記事専用 H2 */
.single-post h2 {
  border:none;
  font-size: 2.1rem;
  font-weight:600;
  position: relative;
  padding-left: .8em;
}

.single-post h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3em;
  height: calc(100% - 0.6em);
  width: 3px;
  background: linear-gradient(
    to bottom,
    rgba(74,61,102,.35),
    rgba(74,61,102,.2)
  );
}

/* ブログ記事だけの本文 */
.single-post p {
  font-size: 1.6rem;
}

/*===========================================
 * 記事ページ：カテゴリとタグ
 * 一覧ページ：カテゴリ
 *==========================================*/
/* ===== 記事下：メタ情報全体 ===== */
p.meta.meta-u {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45em .8em;
}

/* ===== カテゴリ・タグ共通 ===== */
p.meta.meta-u .category.items,
p.meta.meta-u .tags.items {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35em .4em;
}

/* 既存の「,」は非表示 */
p.meta.meta-u .tags.items .break {
  display: none;
}

/* material-icons は使わない（見た目を統一） */
p.meta.meta-u i.material-icons {
  display: none;
}

/* ===== カテゴリ ===== */
p.meta.meta-u .category.items a {
  display: inline-flex;
  align-items: center;
  gap: .35em;
  padding: .22em .6em;
  border-radius: 999px;
  font-size: .95em;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid rgba(74,61,102,.22);
  background: rgba(74,61,102,.08);
  white-space: nowrap;
}

/* リンクは常に親の色を使う（hoverでも変えない） */
p.meta.meta-u .category.items a,
p.meta.meta-u .category.items a:hover,
p.meta.meta-u .category.items a:focus,
p.meta.meta-u .category.items a:active,
p.meta.meta-u .category.items a:visited {
  color: inherit !important;
}

/* カテゴリリンクの前にSVG（sprite symbol） */
p.meta.meta-u .category.items a::before {
  content:"";
  display:inline-block;
  width: 1em;
  height: 1em;
  margin-right: .18em;

  background-color: currentColor;

  -webkit-mask: url("/wp/wp-content/themes/luxech/icons/folder.svg") no-repeat center / contain;
  mask: url("/wp/wp-content/themes/luxech/icons/folder.svg") no-repeat center / contain;

  opacity: .85;
}

/* ===== タグ ===== */
p.meta.meta-u .tags.items a {
  display: inline-flex;
  align-items: center;
  padding: .18em .55em;
  border-radius: 999px;
  font-size: .82em;          /* 小さめ */
  text-decoration: none;
  border: 1px dashed rgba(0,0,0,.18);
  background: transparent;
  opacity: .9;
  white-space: nowrap;
}

/* 各タグの先頭に # を付ける（ラベルなしでもタグとわかる） */
p.meta.meta-u .tags.items a::before {
  content: "#";
  margin-right: .18em;
  opacity: .7;
}

/* hover（主張しすぎない） */
p.meta.meta-u .category.items a:hover,
p.meta.meta-u .tags.items a:hover {
  transform: translateY(-1px);
  transition: .15s ease;
}

/* カテゴリ・タグバッヂの上下余白 */
.single-post p.meta.meta-u {
  padding: 2rem 0;
}

/* カテゴリバッヂの左余白 */
.single-post .meta-box {
  margin-left: 0;
}

/*===========================================
 * サイドバー：はじめての方へ
 *==========================================*/
/* ===== sidebar intro: final (2-line for all items) ===== */

.ob-side-intro__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* li自体には装飾を持たせない */
.ob-side-intro__list li {
  margin: 0;
  padding: 0;
}

/* リンク全体：押し付けない“面”を作る */
.ob-side-intro__list a {
  display: block;
  padding: 10px 10px 10px 12px;
  text-decoration: none;
  color: #222;                  /* リンク色をブランドにしない */
  border-radius: 10px;
  position: relative;

  /* 行間・呼吸 */
  line-height: 1.55;

  /* 変化は最小限 */
  transition: background .08s ease;
}

/* 左のライン：唯一の記号（気配） */
.ob-side-intro__list a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 2px;
  border-radius: 99px;
  background: rgba(74,61,102,.45); /* ブランド紫 */
  opacity: .55;
}

/* hover：背景だけ（文字色は固定） */
.ob-side-intro__list a:hover {
  background: rgba(74,61,102,.03);
}

/* 3項目を“ひとまとまり”に見せるための間隔 */
.ob-side-intro__list li + li a {
  margin-top: 2px;
}

/* 上段：ラベル（先に掴ませる） */
.ob-si__label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #333;
  letter-spacing: .03em;
  line-height: 1.35;
}

/* 下段：説明（控えめ・読みやすい） */
.ob-si__text {
  display: block;
  margin-top: 2px;             /* 2行の間を少しだけ */
  font-size: 12px;
  font-weight: 400;
  color: #222;
  opacity: .82;
  line-height: 1.55;
}

/* 文字量が多い2本目・3本目が詰まらないように */
.ob-side-intro__list a {
  padding-bottom: 11px;        /* 下側をほんの少し厚く */
}

/* モバイル：タップしやすさを優先 */
@media (max-width: 480px) {
  .ob-side-intro__list a {
    padding: 11px 10px 11px 12px;
    border-radius: 10px;
  }
}

/*===========================================
 * サイドバー：プロフィール
 *==========================================*/
/* =========================================
   Sidebar Profile (Custom HTML Widget)
   ========================================= */

.sb-profile {
  border: 1px solid rgb(var(--rgb-base) / .08);
  border-radius: var(--card-radius, 18px);
  padding: 1rem;
  background: rgb(var(--rgb-base) / .02);
}

.sb-profile__avatar {
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 999px;
  overflow: hidden;
  margin: 0 auto .85rem;
  border: 1px solid rgb(var(--rgb-base) / .10);
  background: #fff;
}

.sb-profile__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sb-profile__body {
  display: grid;
  gap: .65rem;
}

.sb-profile__lead {
  margin: 0;
  font-size: .95rem;
  line-height: 1.75;
}

.sb-profile__meta {
  margin: 0;
  font-size: .88rem;
  line-height: 1.7;
  opacity: .82;
}

.sb-profile__link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .92rem;
  text-decoration: none;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid rgb(var(--rgb-base) / .10);
  background: rgb(var(--rgb-base) / .03);
}

.sb-profile__link:hover {
  background: rgb(var(--rgb-base) / .06);
}

.sb-profile__link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.sb-profile__arrow {
  font-size: 1.05em;
  line-height: 1;
}