@charset "utf-8";
/* ################################################################################
   Foundation
   ################################################################################ */


/* ======================================================================
   Base
   ====================================================================== */


/* CSS変数によるサイト全体の各種指定
   ================================================================= */

:root {
	/* [レイアウト]コンテンツ領域の横幅 */
  --layout-width-basic: 100%;
  /* [レイアウト]コンテンツ領域の横幅_メイン */
  --layout-width-main-primary: 96.0rem;
  /* [レイアウト]コンテンツ領域の横幅_サブ */
  --layout-width-main-secondary: 96.0rem;
	
	/* [レイアウト]各コンテンツの下端の余白（Margin） */
  --layout-content-margin-bottom: 0;
  /* [レイアウト]各コンテンツの左右両端の隙間（Padding）※片側のみの指定 */
  --layout-site-bothends-padding: 0;
	
	/* [ページ全体]キーカラー_メイン */
  --keycolor-main: #ec6941;
  /* [ページ全体]キーカラー_サブ */
  --keycolor-sub: #d9d9d9;
	
	/* [ページ全体]背景カラー_container */
  --bgcolor-container: inherit;
  /* [ページ全体]背景カラー_header */
  --bgcolor-header: #fff;
  /* [ページ全体]背景カラー_main */
  --bgcolor-main: inherit;
  /* [ページ全体]背景カラー_footer */
  --bgcolor-footer: #1e5992;


	/* [ページ全体]背景カラー_content */
  --bgcolor-content: #fff;
	
	/* [ページ全体]フォントカラー_テキスト */
  --fontcolor-basic-text: #555;
	
	/* [記事]キーカラー_メイン */
  --keycolor-article-main: #a8977f;
  /* [記事]キーカラー_サブ */
  --keycolor-article-sub: #d9d9d9;
	
	/* [記事]フォントカラー_テキスト */
  --fontcolor-article-text: #555;
}

@media screen and (max-width:959px) {
:root {
  /* [ページ全体]コンテンツ領域の横幅 */
  --layout-width-basic: 100%;
  /* [Main]コンテンツ領域の横幅_メイン */
  --layout-width-main-primary: 100%;
  /* [Main]コンテンツ領域の横幅_サブ */
  --layout-width-main-secondary: 100%;
}
}

@media screen and (max-width:559px) {
:root {
  /* [ページ全体]コンテンツ領域の横幅 */
  --layout-width-basic: 100%;
  /* [Main]コンテンツ領域の横幅_メイン */
  --layout-width-main-primary: 100%;
  /* [Main]コンテンツ領域の横幅_サブ */
  --layout-width-main-secondary: 100%;
}
}