@charset "utf-8";
/* CSS Document */

:root {
	--main-bg: #fff;
	--sub-bg: #eee;
	--accent-color:#ED784A;
	--main-font: #555;
	--head-font: #555;
	--font-family: "Zen Old Mincho", serif;
	--head-font-family: "Zen Maru Gothic", serif;
}


/*========　カスタムプロパティ名称の場所 ========


--main-bg → メイン背景色、articleのbackground-color
--sub-bg → サブ背景色、class="Bk02"のbackground-color
 --accent-color → ボタンとタイトルあしらいの色

--main-font → 本文のフォントカラー
--head-font → hタグのフォントカラー

--font-family →　メインフォントファミリー
--head-font-family　→　h2のフォントファミリー変えたい時に

フォントの種類
角ゴシック（Zen Kaku Gothic New）・・・font-family: "Zen Kaku Gothic New", sans-serif;
丸ゴシック（Zen Maru Gothic）・・・font-family: "Zen Maru Gothic", serif;
明朝体（Zen Old Mincho）・・・font-family: "Zen Old Mincho", serif;

英字筆記体
WindSong・・・・・font-family: "WindSong", cursive;
Italianno・・・・font-family: "Italianno", cursive;
Mrs Saint Delafield・・font-family: "Mrs Saint Delafield", cursive;




===========================================*/


/* スライド内の見出し/本文の幅を強制的に開放 */
#area .area_slider .item_container{ 
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

/* h4 を横幅いっぱいに */
#area .area_slider h4{
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  flex: 0 0 auto !important;    /* flexの影響を受けないように */
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere;
  writing-mode: horizontal-tb !important;
  transform: none !important;   /* 念のため回転も解除 */
}

/* テキスト側も幅を持たせる */
#area .area_slider .txt,
#area .area_slider .txt p{
  width: auto !important;
  max-width: none !important;
  flex: 1 1 auto !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere;
  line-height: 1.6;
}

/* 画像は横幅基準に */
#area .area_slider .flex_wrap img{
  display:block;
  width:100% !important;
  height:auto !important;
}

/* 横並び想定のラップを明示（縦積みさせない） */
#area .area_slider .flex_wrap{
  display:flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap:16px;
}