@charset "utf-8";
/* =========================================================================
   base.css — 送風機器（fan）配下 共通ベーススタイル
   fan配下の全ページで読み込む共通レイヤー。
   ページ固有CSSの後・utility.css の前に読み込むことで、
   ページ個別の指定（.page-* 付き）は従来どおり優先されつつ、
   ページ間で揃えたい基底値のみをここで一元管理する。

   読み込み順：
     reset.css → assets/css/style.css → custom_footer_catalog/css/style.css
     → ページ固有CSS → base.css（本ファイル） → utility.css
   ========================================================================= */

/* ------------------------------------------------------------------------
   見出し（h3）の下スペース
   [2026-07-27 §15 社内FB] 全ページ共通指摘「h3の下のスペースにばらつきがある？」への対応。

   .h3_blue / .h3_default の下スペースがページ間で
   5px / 8px / 10px / 15px / 30px と混在していた
   （特に handdry は同一ページ内で 5px と 30px が混在）。
   原因は、7/21のFB「見出し下の余白が過大」への対応がh3_blue置換の4ページに
   限定されており、それ以外のページが既定値のまま残っていたこと。
   fan配下で最も採用実績の多い 10px を共通の基準値として敷き、ページ間で揃える。

   ・ページ個別に別値を指定しているもの（filterunit/01=5px、handdry sec01=5px、
     products01=8px/15px 等）は .page-* 付きのため従来どおり優先＝移管時の再現値を維持。
   ・margin の一括指定（shorthand）は使わない。上スペースの指定
     （PC時の見出し上40px、および各ページのSP時の上スペース復元）を
     打ち消してしまうため、必ず margin-bottom のみを指定する。
   ------------------------------------------------------------------------ */
.h3_blue,
.h3_default {
  padding: 0;
  margin-bottom: 10px;
}

/* ------------------------------------------------------------------------
   キャプションカードのグレー帯
   [2026-07-27 §15 社内FB] 帯の中に矢印が表示され、マウスを乗せると色が変わる状態だったため戻す。

   キャプションカード（2カラム／単一カラム）の帯に使う要素は、
   fan配下ではいずれもリンクではない（a要素を使わず span で商品名を置いている）。
   共通スタイル側の指定で矢印アイコンとホバー時の半透明が付き、
   さらに矢印を置くための右余白（10%）が確保されていたため、
   帯の文字位置も移管時からずれていた。いずれも本来不要なので打ち消す。

   ・対象は fan配下のキャプションカード全体（sofuki cabinetfan01/03/04/05、kojokicho 商品ラインアップ）。
     今後キャプションカードを使うページが増えても同じ状態になるため、ページ個別ではなくここで一括指定する。
   ・帯そのものの背景・文字サイズ（16px・太字）は共通スタイルの標準をそのまま使う。
   ------------------------------------------------------------------------ */
.column-two_caption .link-backarrow-wh {
  width: 100%;
  padding-right: 0;
  background-image: none;
}
.column-two_caption .link-backarrow-wh:hover {
  filter: none;
  -ms-filter: none;
  opacity: 1;
}

/* ------------------------------------------------------------------------
   ページタイトル（h1_area）のはみ出し
   [2026-08-24 社内FB] 「SP時、h2上部が少し欠けている（なにかオブジェクトが被っている？）」
   handdry/products01・filterunit/01 など複数ページで発生。

   原因は3つの既存指定の重なり。
   (1) .h1_area は SP時 height:70px・padding:18px 0・background:#fff の display:table。
       h1が1行なら 34px + 上下padding36px = 70px で収まるが、2行になると
       39.6px + 36px = 75.6px となり、親 .title_block（70px）から約6px下にはみ出す。
   (2) .title_block と .title_block_in02 は position:relative。
       CSSの描画順では「位置指定された要素」が通常フローの静的コンテンツより後に描画されるため、
       はみ出した白背景が直後のセクションの文字の上に重なる。
   (3) .title_block + .section は padding-top:0 !important で直後のセクションが密着し、
       さらに .h2_default h2 span は line-height:1.18 のため文字が自身のボックスから
       上に約4px溢れる。その溢れた部分が (2) の白帯に隠れ、見出しの頭が欠けて見えていた。

   対処は原因(1)＝はみ出しそのものを止める。上下paddingを12pxに詰めると
   2行（39.6px）でも 70px 以内に収まり、はみ出しは0になる。
   h1は table-cell の vertical-align:middle で中央に置かれるため、
   1行ページは文字の位置・高さとも従来どおり変化なし（セルが34px→46pxに広がるだけ）。
   h2側にpadding-topを足す対処は、原因が残るうえ全ページの余白が変わるため採らない。

   ・メディアクエリは原因となる指定（assets/css/style.css の max-width:640px）と同条件にする。
     fan配下で多用する max-device-width 併記だと、PCの狭い窓幅では効かず不具合が残るため。
   ------------------------------------------------------------------------ */
@media only screen and (max-width: 640px) {
  .h1_area {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}
