@charset "utf-8";
/***************************************************
information
  filename : list_parts.css;
***************************************************/

/*======== list_parts.css ========*/
/****************** リスト ******************/

/* ** list_basic start ** */
/*** 01: リスト要素共通設定 ***/
:root {
/********* 基本装飾 *********/
  --app-li-hr-brd: 1px dotted #cdcdcd; /* 仕切り線ボーダー指定 */
  --app-ListMainTitle-txt: #000; /* リストタイトル色 */
  --app-distxt-txt: #000; /* リストディスクリプション色 */
  --app-person-ph-bg: #cdcdcd; /* リスト記事投稿者背景色 */
  --app-li-rankdatearea-brd: 1px dotted #cdcdcd; /* リストビュー数等アイコンボーダー指定 */
  --app-ListDate-txt: #cdcdcd; /* リスト公開日テキスト色 */
  --app-li-LiIco-rod: 0.2em; /* タグ・カテゴリアイコン角丸 */
  --app-li-LiIco5-rod: 0.5em; /* 横並び一行リストカテゴリアイコン角丸 */
  --app-cateIco-txt: #fff; /* リストカテゴリアイコンテキスト色 */
  --app-li-rankIco-rod: 0.2em; /* リストランキング角丸 */
  --app-li-rankIco-txt: #fff; /* リストランキングテキスト色 */
  --app-li-rankIco-bg: #c00808; /* リストランキング背景色 */

/********* リスト画像 *********/
  --LiFigure-rod: 0.2em; /* 角丸 */
  --app-li-figure-brd: 1px solid #cdcdcd; /* ボーダー指定 */
  --app-li-figure-bg: #cdcdcd; /* 背景色 */
  --app-li-figcaption-txt: #fff; /* テキスト色*/
  --app-li-figcaption-bg: rgba(0,0,0,.6); /* 背景色*/
  --app-li-figcaption-brd: 1px solid #fff; /* ボーダー指定*/
  --font-figureCap: clamp(1.4rem, 1.4vw, 1.6rem); /* フォントサイズ */

/********* 一覧詳細ボタン *********/
  --ListLinkBt-mg: 1.0em auto; /* マージン */
  --ListLinkBt-pd: 1.0rem 0.4em; /* パディング */
  --ListLinkBt-size: 80%; /* ボタンサイズ */
  --ListLinkBt-txt: #fff; /* テキスト色 */
  --ListLinkBt-bg: #171717; /* 背景色 */
  --ListLinkBt-brd: 1px solid #eee; /* ボーダー指定 */
  --ListLinkBt-sd: none; /* 背景影色 */
  --ListLinkBt-rod: 0.2em; /* 角丸 */
}
/* ** list_basic end ** */

/* ** list_dez start ** */
/****************** リスト個別指定（デザインパターン） ******************/
:root {
  --LiBg-rod: 0.2em; /* 角丸 */
  --app-li-clm-brd: 1px solid #eee; /* 枠要素 ボーダー指定*/
  --app-li-clmD-brd: 1px dotted #999; /* 仕切り要素 ボーダー指定*/
  --app-li-clm-bg: #fff; /* 背景色 */
  --app-li-clm-bbg: 0 0 0.5rem #eee; /* 背景影色 */
}
/* ** list_dez end ** */

/* ** list_element start ** */
/********* リスト詳細項目(商品・セミナーで利用) *********/
:root {
/* 概要枠(販売価格等表示エリア) */
  --LiIcoCrt-rod: 0.3em; /* 角丸 */
  --font-ListSubhDet: clamp(1.2rem, 1.0vw, 1.4rem); /* 見出しフォントサイズ */
  --font-kinagakuTxt: clamp(1.4rem, 1.6vw, 2.6rem); /* 価格フォントサイズ */
  --font-SemPrdIco: 1.3rem; /* 見出しアイコン表示用 フォントサイズ */
  --app-li-SubhDet3-bg: #cdcdcd; /* 背景色 写真無しテキストリンクのみ*/
  --app-li-SubhDet-brd: 1px dotted #cdcdcd; /* ボーダー指定 */
  --app-li-SubhDet3-brd: 1px solid #cdcdcd; /* ボーダー指定 写真無しテキストリンクのみ*/
/* セミナー用アイコン */
	/* 価格 */
  --sem-kinagaku-txt: #fff; /* テキスト色 */
  --sem-kinagaku-bg: #a33f3f; /* 背景色 */
	/* 開催日 */
  --sem-kaisaibi-txt: #fff; /* テキスト色 */
  --sem-kaisaibi-bg: #9a8547; /* 背景色 */
	/* 開催場所 */
  --sem-kaisaibasyo-txt: #fff; /* テキスト色 */
  --sem-kaisaibasyo-bg: #4483a6; /* 背景色 */
	/* 開催期間 */
  --sem-kigen-txt: #fff; /* テキスト色 */
  --sem-kigen-bg: #648b33; /* 背景色 */
	/* 空き状況 */
  --sem-aki-txt: #fff; /* テキスト色 */
  --sem-aki-bg: #666666; /* 背景色 */
/* 商品用アイコン */
	/* 価格 */
  --prd-kinagaku-txt: #fff; /* テキスト色 */
  --prd-kinagaku-bg: #a33f3f; /* 背景色 */
	/* 販売日 */
  --prd-hanbaibi-txt: #fff; /* テキスト色 */
  --prd-hanbaibi-bg: #9a8547; /* 背景色 */
	/* 販売方法 */
  --prd-hanbaiMth-txt: #fff; /* テキスト色 */
  --prd-hanbaiMth-bg: #4483a6; /* 背景色 */
	/* 空き状況 */
  --prd-aki-txt: #fff; /* テキスト色 */
  --prd-aki-bg: #666666; /* 背景色 */
}
/* ** list_element end ** */

/* ** flex_list start ** */
:root {
  --FlexListInn-rod: 0.2rem; /* 角丸 */
  --app-FlexListInn-brd: 1px dotted #bbbbbb; /* ボーダー指定 */
  --app-FlexListInn-bg: #fff; /* 背景色 */
  --app-FlexListInnS-bg: #eee; /* 背景色差し色 */
  --app-FlexDataArea-bg: inhelit; /* 背景色 リスト一件抽出個別枠 */

/* 状態による背景色 */
  --app-FlexListInn-endState-bg: #ededed; /* 処理終了等の背景色 */
  --app-FlexListInn-artState-bg: #eaf9e9; /* アラート喚起等の背景色 */
  --app-FlexListInn-trlState-bg: #fffdce; /* 合計等の背景色 */

/* 個別要素(写真) */
  --app-FlexItemPh-bg: #fff; /* 写真処理の背景色 */
  --app-PhCircle-size: 6.0rem; /* 丸型写真サイズ */
  --app-PhSquare-size: 6.0rem; /* 四角写真サイズ */
  --app-PhRectangle-size: 10.0rem; /* 長方形写真サイズ（横） */
  --app-PhRectangleH-size: 7.0rem; /* 長方形写真サイズ（縦） */
  --app-PhCircle-sizeS: 4.0rem; /* 丸型写真サイズ */
  --app-PhSquare-sizeS: 4.0rem; /* 四角写真サイズ */
  --app-PhRectangle-sizeS: 4.0rem; /* 長方形写真サイズ（横） */
  --app-PhRectangleH-sizeS: 3.0rem; /* 長方形写真サイズ（縦） */

/* インラインボックス */
  --FlexItemDataBox-rod: 0.3rem; /* ボックス */
  --app-FlexItemDataBox-bg: #f8f8f8; /* 外枠背景色 */
  --app-FlexItemDataBox-brd: 1px solid #cdcdcd; /* 外枠ボーダー指定 */
  --app-FlexItemDataBox-txt: #383838; /* テキスト色 */

/* リスト内タイトル */
  --FlexItemDataTi-rod: 0.2rem; /* 角丸 */
  --app-FlexItemDataTi-bg: #eee; /* 背景色 */
}
@media screen and (max-width: 480px) {
:root {
	  --app-PhCircle-size: 5.0rem; /* 丸型写真サイズ */
	  --app-PhSquare-size: 5.0rem; /* 四角写真サイズ */
	  --app-PhRectangle-size: 6.0rem; /* 長方形写真サイズ（横） */
	  --app-PhRectangleH-size: 4.0rem; /* 長方形写真サイズ（縦） */
	  --app-PhCircle-sizeS: 5.0rem; /* 丸型写真サイズ */
	  --app-PhSquare-sizeS: 5.0rem; /* 四角写真サイズ */
	  --app-PhRectangle-sizeS: 6.0rem; /* 長方形写真サイズ（横） */
	  --app-PhRectangleH-sizeS: 4.0rem; /* 長方形写真サイズ（縦） */
	}
}
/* ** flex_list end ** */

/* ** qa_list start ** */
/*** FAQリスト ***/
:root {
/* QA折り畳みボタン指定 */
  --app-qaTiArea-slide_btn-txt: #fff; /* テキスト色 */
  --app-qaTiArea-slide_btn-bg: #000; /* 背景色 */

/* QAアイコン指定 */
  --app-qaTiIco-txt: #c20707; /* テキスト色 */
  --app-qaAnsIco-txt: #076cc2; /* テキスト色 */

/* QAアンサー指定 */
  --app-qaAnsArea-bg: #fff; /* 背景色 */
}
/* ** qa_list end ** */

/* ** friend_list start ** */
/* ** friend_list end ** */

/* ** ajax_listimg_loading start ** */
/* ** ajax_listimg_loading end ** */