@charset "UTF-8";/*hattool*/
body {
   font-family: "Zen Maru Gothic", serif;
   font-weight: 500;
   font-style: normal;
   width:100%;
   margin: auto;
}
.column-850 {
   width:850px;
   margin: auto;

}
/*スマホの時だけ改行させるクラス*/
.br-sp {
    display: none;
}

@media (max-width: 640px) {
    .br-sp {
        display: block;
    }
}
/*-------------------------
見出し・テキスト設定 
--------------------------*/
h1.c-entry__title{/*投稿記事*/
	font-size: 1.7rem !important;
	font-weight: 700 !important;
}
@media (max-width: 640px){ 
h1.c-entry__title{
    font-size: 1.5rem!important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
}
}

h2.title2{
	font-size: 1.875rem !important;
	font-weight: 500 !important;
}
@media (max-width: 640px){ 
h2.title2 {
    font-size: 1.5rem!important;
	font-weight: 500 !important;
}
}


h3.title3{
	font-weight: 800!important;
    font-size: 1.5rem !important;
}

@media (max-width: 640px){ 
h3.title3 {
    font-size: 1.25rem!important;
	font-weight: 800 !important;
}
}

h3.title3red {
	margin:50px 0 50px 0;
	color: #A02A2A;
	padding-left: 10px;             
	border-left: solid 4px #A1D2D6;  /* 左線 */
	font-weight: 800 !important;     /* インラインの500を上書き */
	font-size: 1.5rem !important;    /* インラインの1.75remを上書き */
	text-align: left;
	letter-spacing: -0.03em;
}

@media (max-width: 640px){ 
  h3.title3red {
    font-size: 1.25rem !important;
    padding: 0.25em 0.5em;          /* 上下左右の余白に変更したいならここで上書き */
    letter-spacing: -0.03em;
}
}

h4.title4 .title4red{
	font-size: 1.25rem !important;
	font-weight: 800 !important;

}
h4.title4red{
	color: #D85353;
	margin:50px 0 30px 0;
}
}
@media (max-width: 640px){ 
h4.title4 .title4red {
    font-size: 1.125rem!important;
	font-weight: 800 !important;
}
h4.title4red{
	color: #D85353;
}
}


/*本文バリエーション*/
.honbun-big {
	font-size: 1.25rem !important;
	font-weight: 500 !important;
	line-height: 1.65rem;
}
@media (max-width: 640px){ 
.honbun-big {
    font-size: 1.175rem!important;
	font-weight: 500 !important;
	line-height: 1.65rem;
}
}
.honbun-big ul li::before{
	background-color:#D85353 important;
	color:#faf5ec;
}


/*固定ページのタイトルを非表示*/
/* 固定ページだけ、c-entry__title を非表示にする */
.page .c-entry__header .c-entry__title {
  display: none;
}


/*** リンクで色を変更しない↓ ***/
/* li.link-noncolor の中の a タグに適用 */
.link-noncolor a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

.link-noncolor a:hover {
  color: #90D2D8; /* お好みの色 */
}

/*** リンクで色を変更しない↑ ***/

/***各種区切り線↓***/

/*極細1px*/
hr.hr1 {
  height: 1px;
  border: none;
  background-color: #ddd;
  margin: 20px 0;
}

/*グレーの丸点線*/
hr.hr-dot {
  border: none;
  border-bottom: 4px dotted #DBDBDB;
  margin: 20px 0; /* 必要に応じて上下のマージンを調整 */
}

hr.hr-dot2 {
  border: none;
  border-bottom: 2px dotted #DBDBDB;
}
/***各種区切り線↑***/


/*--------------
メインヘッダーの文字サイズ
そう！こういうのを作りたかった！
----------------*/
@media (max-width: 640px){ 
.sou{
	font-size: 3.9rem !important;
}

.kouiuno{
		font-size:2.2rem;
	}
}



/*-------------------------
グロナビ・ヘッダー設定 
--------------------------*/
/*インフォバー*/
.p-infobar__content{
	font-size: 14px;
}

/*ロゴ横 会社概要・プレリリ・ブログ*/
.ss-small a{
	font-size: 14px !important;
	text-decoration: none !important;
	color:#333333;
}
.ss-small a:hover{
	color:#90D2D8;
}

/*PC版 グロナビ区切り線*/
 .grobnavi-line a{
	border-left: 1px solid #D85353 ;
    height: 20px ;
	margin: auto;
}
/*PC版 アイコン配置*/
.grobnavi-icon{
   display:inline-block;
   text-align: center;
   font-weight: 600;
}

/*PC版 見積もり・依頼　緑囲み*/
.grobnavi-maru{
	border: solid 2px #74D96F;
	border-radius: 25px;
	margin-top: 2px;
	margin-left: 5px;
	padding-right: 5px;
	padding-left: 5px;
	text-align: center;
	font-size: 0.75rem;
	width:105px;
	display: inline-block;
}

/*PC版 グロナビ問い合わせボタン*/
.grobnavi-toibt  {
	background-color: #74D96F;
	border-radius: 10px;
	text-align: center;
	width:205px;
	height:60px;
    font-weight: 400!important;
	color:#ffffff;
	font-size: 1rem;
	font-weight: 700!important;
	padding-top: 5px;
}
.grobnavi-toibt-s  {
	font-size: 0.75rem;
}

/* メニュー項目の均等サイズ揃えを無効化*/ 
.p-global-nav .c-navbar .c-navbar__item {
    flex: 0 0 auto;
	padding-left: 10;
    padding-right: 10;
}

/*メニューリンクの左右 padding を調整*/
.p-global-nav .c-navbar .c-navbar__item a {
    padding-left: 37px;
    padding-right: 37px;
	margin-left:0;
	margin-right: 0;
}

/**** サブメニュー（赤いバー）  ****/

/* ▼ サブナビ（スマホ・タブレットでは非表示） */
.p-subnav {
    display: none; /* デフォルトは非表示（スマホ・タブレット） */
}

/* ▼ PC（1024px以上）のときだけ表示・レイアウト */
@media (min-width: 1024px) {

    .p-subnav {
        display: block;
        background: #d85353;
    }

    /* 1100pxコンテナ */
    .p-subnav__inner {
        max-width: 1100px;
        margin: 0 auto;
    }

    /* メニューの横並び */
    .p-subnav__list {
        display: flex;
        justify-content: center;
        list-style: none;
        margin: 0;
        padding: 0.2rem 1rem 0.5rem;
    }

    /* 各リンクの左右余白＋縦線用の設定 */
    .p-subnav__list li {
        position: relative;
        padding: 0 1.2rem;  /* ここでリンク間の余白を調整 */
    }

    /* リンクとリンクの間の縦ライン */
    .p-subnav__list li:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 14px;  /* 縦線の長さ。お好みで調整OK */
        background-color: rgba(255, 255, 255, 0.5);
    }

    /* 文字サイズなど */
    .p-subnav__list a {
        color: #fff;
        text-decoration: none;
        font-size: 14px;      /* ← お好みで 13px / 12px に変更OK */
        font-weight: 600;
        white-space: nowrap;  /* 折り返したくない場合は残す */
    }

    .p-subnav__list a:hover {
        text-decoration: underline;
    }
}





/*-------------------------
TOPページ設定 
--------------------------*/
@media (max-width: 640px){ 
.top-menubt {
    font-size: 0.75rem!important;
}
}


/*------ピックアップスライダ複枚数表示ー----------*/

/* ピックアップ事例の写真下のテキストを非表示 */
.pickup-jirei .c-entry-summary__body,
.pickup-jirei .c-entry-summary__term {
    display: none !important;
}

/* ピックアップ事例：PC で4枚並べて表示 */
@media (min-width: 960px) {
  .pickup-jirei .c-entries-carousel .spider__slide {
    flex: 0 0 25% !important;  /* 横幅を4分の1に固定 */
    max-width: 25% !important;
  }
}



/*-------------------------
サイドバー設定 
--------------------------*/
/* PC幅で、本文とサイドバーを横並びにする */
@media (min-width: 1024px) {

  /* 本文＋サイドバーを横一列に */
  .l-contents__body .l-contents__container .l-contents__inner {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
  }

  /* 本文エリア */
  .l-contents__main {
    width: calc(100% - 320px); /* サイドバー分を引いた幅 */
    margin-right: 40px;        /* 本文とサイドバーの間の余白 */
  }

  /* サイドバーエリア */
  .l-contents__sidebar {
    width: 320px;
    flex: 0 0 320px;
    margin: 0;
    clear: none;               /* 下に落ちないようにクリアを無効化 */
  }
}

/*相談してみるボタン*/

.grobnavi-sidebt  {
	background-color: #74D96F;
	border-radius: 10px;
	text-align: center;
	width:100%;
	height:60px;
    font-weight: 600;
	color:#ffffff;
	font-size: 1rem;
	padding-top: 5px;
}
.grobnavi-sidebt-s  {
	font-size: 0.75rem;
}

/*-----------------------
スマホ　ドロワーナビゲーション
-------------------------*/
/* ハンバーガーボタンの3本線を太くして色を変更 */
.c-hamburger-btn__bar {
  height: 3px !important; /* 線を太くする */
  background-color: #A02A2A !important; /* 指定の色に変更 */
}

/* 線と線の間のスペースを広げる */
.c-hamburger-btn__bars {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important; /* 線の間隔を広げる(デフォルトは4px程度) */
}

/* または、個別に間隔を指定する方法 */
.c-hamburger-btn__bar:not(:last-child) {
  margin-bottom: 6px !important; /* 各線の下マージンで間隔調整 */
}

/* ホバー時やアクティブ時も同じ色を維持 */
.c-hamburger-btn:hover .c-hamburger-btn__bar,
.c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__bar {
  background-color: #A02A2A !important;
}

/* MENUの文字を非表示にする */
.c-hamburger-btn__label {
  display: none !important;
}

/* ボタン全体のパディング調整 */
.c-hamburger-btn {
  padding-bottom: 0 !important;
}
/* 開いた時に×(バツ)にする */
.c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__bar:nth-child(1) {
  transform: rotate(45deg) translate(0px, 0px) !important;
  background-color: #A02A2A !important;
}

.c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__bar:nth-child(2) {
  opacity: 0 !important; /* 真ん中の線を消す */
}

.c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__bar:nth-child(3) {
  transform: rotate(-45deg) translate(0px, -0px) !important;
  background-color: #A02A2A !important;
}

/* 開いた時のgap調整 */
.c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__bars {
  gap: 0 !important;
}


/*ドロワーナビ背景色*/
.c-drawer {
    background-color: #FBF9F6;
    color: #333333;
}
/*アイコンサイズ制御*/
.drow-icon img {
    width:30px;
	}


/* ドロワーナビを上端に詰める */
.c-drawer__inner {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  height: 100% !important;
  padding-top: 50px !important; /* ハンバーガーボタンの分だけ確保 */
}

/* ロゴの上マージンをゼロに */
#block-55 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-bottom: var(--wp--preset--spacing--40) !important; /* ロゴ下の余白調整 */
}

/* ロゴ画像自体の上余白もゼロに */
#block-55 figure {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* タイトルの上余白も調整 */
#block-54 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* すべてのウィジェット間の余白を詰める */
.c-drawer .c-widget {
  margin-top: 0 !important;
}

/* コントロールエリア(ハンバーガーボタン)を上部固定 */
.c-drawer__controls {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 100;
}
/* さらに上に詰める場合 */
.c-drawer__inner {
  padding-top: 5px !important; /* または 30px */
}

	
	
/*-------------------------
BOX設定
--------------------------*/
.box-full-beige{
  max-width: 850px !important;
}

/*------------------------
各コンテンツTOPページ
---------------------------*/

/*メインヘッダー全幅*/
#front-page-top-content .alignfull.main-header {
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
}

/***メインヘッダー上に配置とパンクズリスト下に配置↓***/
/* シンプルな解決策 */
.l-contents__container {
    display: flex;
    flex-direction: column;
}

/* ヘッダー画像をパンくずの上に配置 */
#front-page-top-content {
    order: -1;
    margin-bottom: 0;
}

/* メインヘッダー全幅（既存） */
#front-page-top-content .alignfull.main-header {
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
}

/* パンくずリストの調整 */
.p-breadcrumbs-wrapper {
    order: 0;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* その他のコンテンツ */
.p-entry-content,
.l-contents__inner {
    order: 1;
}

/* パンくずリスト全体を左揃え */
.p-breadcrumbs-wrapper {
    text-align: left;
    padding-left: 0;
}

.c-breadcrumbs {
    justify-content: flex-start !important;
    text-align: left;
    margin-left: 0;
}

/* パンくずリストアイテムの配置 */
.c-breadcrumbs__item {
    text-align: left;
}

/* コンテナ内での配置調整 */
.c-container .p-breadcrumbs-wrapper,
.c-container .c-breadcrumbs {
    margin-left: 0;
    padding-left: 0;
}

/***メインヘッダー上に配置とパンクズリスト下に配置↑***/




/* 投稿ページとカテゴリーページでヘッダー画像を非表示↓ */
.single #front-page-top-content,
.single-post #front-page-top-content,
.category #front-page-top-content,
.archive #front-page-top-content,
.tag #front-page-top-content,
.search #front-page-top-content {
    display: none !important;
}

/* 固定ページでは表示 */
.page #front-page-top-content {
    display: block;
}

/* お問い合わせページとプライバシーポリシーページでは非表示 */
.page-id-3 #front-page-top-content,
.page-id-48 #front-page-top-content,
.page-id-54 #front-page-top-content,
.page-id-56 #front-page-top-content,
.page-id-58 #front-page-top-content,
.page-id-1346 #front-page-top-content {
    display: none !important;
}


/* 投稿ページとカテゴリーページでヘッダー画像を非表示↑ */


/****テーブル表↓****/
/*リンク色指定*/
.table-link a{
	color:#D85353;
}

/* wp-block-tableに対応した横スクロール設定 */
.wp-block-table.c-responsive-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
}

/* テーブル本体の設定 */
.c-responsive-table table {
  min-width: 650px; /* 横スクロールが必要な最小幅 */
  width: auto !important;
  table-layout: auto !important;
  border-collapse: collapse;
}

/* 見出しセルの設定 */
.c-responsive-table th {
  white-space: nowrap; /* 見出しは1行で表示 */
  padding: 12px 16px;
  vertical-align: middle;
}

/* データセルの設定 */
.c-responsive-table td {
  padding: 12px 16px;
  vertical-align: top;
  white-space: normal; /* データセルは折り返しOK */
  min-width: 120px; /* 各セルの最小幅 */
}

/* brタグでの改行をしっかり表示 */
.c-responsive-table td br {
  display: block;
  content: "";
  margin-top: 4px;
}

/* 小さいテキストの調整 */
.c-responsive-table .has-sm-xs-font-size {
  display: block;
  margin-top: 4px;
  line-height: 1.5;
}


/****テーブル表↑****/



/*****詳細を見るアコーディオン*******/
.syosai-kadomaru{
	border-radius:15px;
}

/*****サービス紹介アンカーリンク↓*******/
/* アイコンの縮小と間隔調整 */
.anker-link .wp-block-button__link::before {
    transform: scale(0.5);
    margin-right: -25px;
}

/* リンクの文字色を変更（正しいセレクタ） */
.wp-block-button.anker-link .wp-block-button__link {
    color: #333333;
}

/* 通常時 */
.wp-block-button.anker-link .wp-block-button__link {
    color: #333333;
}

.wp-block-button.anker-link .wp-block-button__link::before {
    transform: scale(0.5);
    margin-right: -25px;
}

/* マウスオーバー時 */
.wp-block-button.anker-link .wp-block-button__link:hover {
    color: #90D2D8;
}

.wp-block-button.anker-link .wp-block-button__link:hover::before {
    color: #90D2D8;
}

/*****サービス紹介アンカーリンク↑*******/




/* サンプル事例PC・タブレットでは今の表示をそのまま維持 */
.sample-jirei {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* ←お好みのPC設定 */
  gap: 20px;
}

/* サンプル事例スマホ（640px以下）だけ 2カラムに変更 */
@media (max-width: 640px) {
  .sample-jirei {
    grid-template-columns: repeat(2, 1fr) !important; /* 2列にする */
    gap: 12px !important; /* 画像の間隔 */
  }

  .sample-jirei figure {
    width: 100%;
    margin: 0;
  }

  .sample-jirei img {
    width: 100%;
    height: auto;
    display: block;
  }

  .sample-jirei figcaption {
    text-align: center;
    font-size: 14px;
    margin-top: 4px;
  }
}

/* 画像キャプションをセンター揃え */
.wp-element-caption {
  text-align: center;
}



/* 参考価格吹き出しのアバター画像の丸マスクを解除↓ */
/* 吹き出しアバターの丸マスクを完全解除 */
.smb-balloon__figure,
.smb-balloon__figure img {
    border-radius: 0 !important;
    overflow: visible !important;
	padding-left: -10px;
	padding-right: 0px;

}
/* スマホサイズのみ適用 */
@media (max-width: 640px) {
    .smb-balloon__person {
        display: flex !important;
        align-items: flex-start !important; /* ②画像を上に */
        overflow: visible !important;
        width: 100% !important;
        padding-left: 0 !important; /* ①左の切れを防止 */
        margin-left: 0 !important;
    }
    
    .smb-balloon__figure {
        width: auto !important;
        min-width: 200px !important;
        flex-shrink: 0 !important;
        overflow: visible !important;
        padding: 0 !important;
        margin: 0 !important; /* ③左寄せ */
        margin-right: 10px !important; /* テキストとの余白 */
        align-self: flex-start !important; /* ②画像を上に */
    }
    
    .smb-balloon__figure img {
        width: 119px !important;
        height: 82px !important;
        max-width: none !important;
        display: block !important;
		margin-top: -15px !important; /* 画像を上に移動 */
		margin-right:-10px!important;
    }
    
    /* 吹き出しのテキスト部分 */
    .smb-balloon__body {
        flex: 1 !important;
        min-width: 0 !important;
    }
}

.fukidashi-padding0 .smb-balloon__body {
	padding: 0;
	margin-top:0;
}
/* 参考価格吹き出しのアバター画像の丸マスクを解除↑ */

/**** 業種の表：ヘッダー行全体の高さを狭くする ****/
.gyousyu-head.smb-information__item {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  min-height: auto;
}

/* 左側ラベル（業界分類） */
.gyousyu-head .smb-information__item__label {
  padding: 4px 6px !important;
  font-size: 0.9rem;
  line-height: 1.2;
}

/* 右側テキスト（業種） */
.gyousyu-head .smb-information__item__body {
  padding: 4px 6px !important;
}

/* 段落自体の上下余白を削る */
.gyousyu-head .smb-information__item__body p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2;
}
/* ヘッダー行の外枠・内枠を全て消す */
.gyousyu-head.smb-information__item,
.gyousyu-head .c-row,
.gyousyu-head .c-row__col,
.gyousyu-head .smb-information__item__label,
.gyousyu-head .smb-information__item__body {
  border: none !important;
}

/* Snow Monkey の CSS 変数による枠線も無効化 */
.gyousyu-head.smb-information__item {
  --smb-information--border-width: 0 !important;
}
/**** 業種の表hedder↑ ****/

/* ====================================
   gyoushu 表：通常行の枠線の余白を狭くする
==================================== */

/* 各行（ヘッダー以外）の上下余白を詰める */
.gyoushu .smb-information__item:not(.gyousyu-head) {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* セル（左ラベル／右内容）の余白も詰める */
.gyoushu .smb-information__item:not(.gyousyu-head) .smb-information__item__label,
.gyoushu .smb-information__item:not(.gyousyu-head) .smb-information__item__body {
  padding: 4px 6px !important;
}

/* 行コンテナ（c-row）の余白をゼロに */
.gyoushu .smb-information__item:not(.gyousyu-head) .c-row {
  margin: 0 !important;
}

/* pタグの余白も削る */
.gyoushu .smb-information__item:not(.gyousyu-head) p {
  margin: 0 !important;
  padding: 10 !important;
}

/* Snow Monkey が自動で追加する枠線内側スペースを最小化 */
.gyoushu.smb-information--has-border {
  --smb-information--column-padding: 2px !important;
}


/*****メニューページのサイズと適した使い方の表の調整↓********/

/* 横の区切り線のみ表示するスタイル */
.jouhou-underline .smb-information__item {
  border-bottom: 1px solid #e0e0e0; /* 各項目の下に線を追加 */
  padding-bottom: 1.5rem; /* 下部に余白を追加 */
  padding-top: 1.5rem; /* 上部に余白を追加 */
}

/* 最後の項目の下線を削除(オプション) */
.jouhou-underline .smb-information__item:last-child {
  border-bottom: none;
}

/* デフォルトの枠線や背景を削除 */
.jouhou-underline .smb-information__item {
  border-left: none;
  border-right: none;
  border-top: none;
  background: none;
}

.jouhou-underline{
	padding: 0!important;
}
/*****メニューページのサイズと適した使い方の表↑********/

/*--------------------------
よくある質問ページ
---------------------------*/
/* アコーディオンアイテムのコンテナ */
.wp-block-accordion-item {
  position: relative;
}

/* 質問部分(ヘディング)のスタイル */
.wp-block-accordion-heading {
  position: relative;
  padding-left: 50px !important; /* アイコン分の左余白を確保 */
}

/* 質問のアイコン(Q) */
.wp-block-accordion-heading::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background-image: url('http://hattool.com/hat810/wp-content/uploads/2025/12/icon-q.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ボタン要素の調整 */
.wp-block-accordion-heading__toggle {
  width: 100%;
  padding-left: 0 !important;
}

/* 回答部分(パネル)のスタイル */
.wp-block-accordion-panel {
  position: relative;
  padding-left: 50px !important; /* アイコン分の左余白を確保 */
  padding-top: 15px;
  padding-bottom: 15px;
  padding-right: 15px;
}

/* 回答のアイコン(A) */
.wp-block-accordion-panel::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 15px;
  width: 30px;
  height: 30px;
  background-image: url('http://hattool.com/hat810/wp-content/uploads/2025/12/icon-a.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* レスポンシブ対応(スマートフォン向け) */
@media screen and (max-width: 767px) {
  .wp-block-accordion-heading,
  .wp-block-accordion-panel {
    padding-left: 50px !important;
  }
  
  .wp-block-accordion-heading::before,
  .wp-block-accordion-panel::before {
    width: 35px;
    height: 35px;
    left: 8px;
  }
}




/*--------------------------
footer
--------------------------*/

/*footer背景色*/
.l-footer {
	background-color: #FBF9F6!important; /* 背景色 */
}
/*コピーライト部分の背景色*/
.l-footer .c-copyright {
	background-color: #FBF9F6;
	color:#333333;
}

/*footer問い合わせボタン*/
.grobnavi-footibt {
    background-color: #74D96F;
    border-radius: 10px;
    width: 100%;
    height: auto;
    font-weight: 600;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 10px;
    display: flex;
    align-items: center;      /* 縦方向（上下）中央揃え */
    justify-content: center;  /* ★ 横方向（左右）中央揃え */
    gap: 0.5em;
    text-align: center;       /* 念のため中央揃え */
}

.grobnavi-footibt-s {
    font-size: 0.75rem;
    white-space: nowrap; /* 改行防止 */
}

/* コンテンツメニューアイコン ●にしたい項目だけ SVG 矢印を非表示 */
.dot-item .smb-list__icon svg {
    display: none !important;
}

/* ▼ ●を表示する */
.dot-item .smb-list__icon::before {
    content: "●";
    color: #D85353;      
    font-size: 0.75rem;
    margin-right: 5px;
    display: inline-block;
    transform: translateY(-1px);
}

/*真ん中コンテンツメニュー下階層>*/
.dot-item-s {
	padding-left: 20px;
	line-height: 18px;
}
.dot-item-s .smb-list__icon svg {
	padding-left: 20px;
	line-height: 18px;
}
/*右コンテンツメニュー行間狭くする*/
.dot-item-j{
	line-height: 18px;
}
.dot-item-j .smb-list__icon svg {
	line-height: 18px;
}

.footer-menu{
	font-size: 0.8rem;
}


/*--------------------------
カテゴリー一覧ページ
----------------------------*/
h2.c-entry-summary__title{
	font-size: 18px !important;
	font-weight: 500;
	line-height: 26px;
}


/*--------------------------
ブログ記事投稿設定
----------------------------*/

/*新しい記事・古い記事横スクロール非表示*/
.c-prev-next-nav {
  display: none;
}


/*関連記事上下の余白設定*/
.p-related-posts__title {
  margin-top: 50px;
  margin-bottom: 30px;
}


/*ブログタイトル*/
.c-entry__title{
	font-size: 1.6rem;
	font-weight:600;
	line-height: 2.1rem;
	letter-spacing: 0.1rem;
}

/* 投稿記事の上にアイキャッチ画像 */
.c-entry__thumbnail {
  width: 100%;
  max-width: 1280px;
  max-height: 350px;
  overflow: hidden;
  margin: 0 auto;
  margin-bottom: 40px !important;
}

/* voiceカテゴリーではアイキャッチ画像を非表示 */
.category-voice .c-entry__thumbnail {
  display: none !important;
}

/* プレスリリースカテゴリーではアイキャッチ画像を非表示 */
.category-pressrelease .c-entry__thumbnail {
  display: none !important;
}



@media (max-width: 640px){
  .c-entry__thumbnail {
    margin-bottom: 20px !important;
  }
}

@media (min-width: 641px){
  .c-entry__thumbnail {
    width: 100%;
    max-width: 1280px;
    height: 350px !important;
    overflow: hidden;
    margin: 0 auto 40px !important;
  }
}

.c-entry__thumbnail img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}

/* 投稿者メタを非表示に */
.c-meta__item--author,
.c-meta__item--modified {
  display: none !important;
}


/* 見出しデザイン（00＋上線＋下点線＋マーカー線） */
.c-section-title {
  position: relative;
  margin: 40px 0 35px;
  padding-top: 25px;
  padding-bottom: 12px;
  border-bottom: 2px dotted #333;  /* 下の点線 */
  font-weight: 600;
  /*text-decoration: underline; /* マーカー下線 */
 /* text-decoration-thickness: 0.5em; /*  マーカー線の太さ */
 /* text-decoration-color: rgba(255, 228, 0, 0.4); /*  マーカー線の色 */
 /* text-underline-offset: -0.2em; /*  マーカー線の位置。テキストに重なるようにやや上部にする */
 /* text-decoration-skip-ink: none;*/
}


/* 上の横線 */
.c-section-title::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 48px;   /* 数字の右から線を開始 */
  right: 0;
  border-top: 1px solid #333;
}


/* 左上を画像に変更 */
.c-section-title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;

  /* 画像のURLを指定 */
  width: 39px;       /* 画像サイズに合わせて調整 */
  height: 21px;
  background: url("https://hattool.com/hat810/wp-content/uploads/2025/12/h2ten3.png")
    no-repeat center / contain;
}

/*--------------------------
投稿記事一覧
----------------------------*/

/*2列を3列に*/
@media (min-width: 64em) {
  .c-entries--rich-media .c-entries__item {
    flex: 0 1 33.333%;
    max-width: 33.333%;
  }
}
/* サムネイル画像を角丸に */

.c-entry-summary__figure {
  border-radius: 10px;
  overflow: hidden; /* 重要: はみ出た部分を隠す */
  background-color: transparent; /* 背景を透明に */
}

.c-entry-summary__figure img {
  border-radius: 0;
  display: block; /* インライン要素の隙間を消す */
  width: 100%;
  height: 100%;
  object-fit: cover; /* 画像を枠にフィットさせる */
}


/*----------------------------
問い合わせページ
-----------------------------*/
/**問い合わせボタン↓**/

/* 各フォームパーツのデザインをリセット */
.smf-button-control__control,
.smf-text-control__control,
.smf-textarea-control__control {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  font-size: 100% !important;
  font-weight: 600;
  font-family: inherit !important;
}

/* フォームボタンをデザイン */
.smf-button-control__control {
  background: var(--accent-color,#cd162c) !important;
  color: #fff !important;
  border: none !important;
  transition: background-color 0.3s ease !important;
}

/* 「戻る」フォームボタンを個別にデザイン */
.smf-button-control__control[data-action="back"] {
  background: transparent !important;
  color: #333 !important;
  text-decoration: underline !important;
}

/* 「戻る」以外のフォームボタンのホバー＆フォーカス色 */
.smf-button-control__control:not([data-action="back"]):hover,
.smf-button-control__control:not([data-action="back"]):focus {
  background: var(--dark-accent-color,#710c18) !important;
}

/**問い合わせボタン↑**/

/* 確認画面で注意書きのtextareaを非表示 */
.snow-monkey-form[data-screen="confirm"] textarea[name="textarea-1jdkj9qbh"] {
    display: none !important;
}

/* 念のため親要素ごと非表示 */
.snow-monkey-form[data-screen="confirm"] .smf-placeholder[data-name="textarea-1jdkj9qbh"] {
    display: none !important;
}

/* loadingが終わって確認画面になった後も非表示 */
.snow-monkey-form:not([data-screen="input"]) textarea[name="textarea-1jdkj9qbh"] {
    display: none !important;
}

.snow-monkey-form:not([data-screen="input"]) .smf-placeholder[data-name="textarea-1jdkj9qbh"] {
    display: none !important;
}