/*=======================================================================*/
/*
layout_media.css
スマートフォンレイアウト用のCSS
*/
/*=======================================================================*/

/*=======================================================================*/
/* 共通設定（ヘッダー・フッター） */
/*=======================================================================*/

html,body {
	width: 100%;
	margin: 0;
	padding: 0;
}


/*=======================================================================*/
/* 共通設定（ヘッダー） */
/*=======================================================================*/

header {
	width: 100%;
	margin: 0;
	padding: 0;
}

@media screen and (max-width: 767px) {
  
    html.bFixed,
    body.bFixed {
      height: 100%;
      overflow: hidden;
    }
  
    header.bFixed {
      display: block;
      width: 100%;
      height: 100%;
      z-index: 10000;
      position: fixed;
      top: 0;
      left: 0;
      background: #FFF;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
    }

	#uNav {
		display: none;
	}


	#hNav {
      width: 98%;
      margin: 10px auto;
      display: block;
      z-index: 1000;
	}

	#hNav .Logo {
		width: 250px;
		display: block;
		    margin: 0 0 5px 0;
		vertical-align: middle;
	}

	#hNav .CatchTxt {
		display: none;
	}
	#hNav .CatchEco {
		display: none;
	}
  
	#hNav .SiteMenu {
		display: none;
		width: 100%;
		margin: 0;
		vertical-align: middle;
	}
    #SPmulti {
      display: block!important;
    }

	#gNav {
      display: none;
      width: 100%;
      padding: 0px 0;
      margin: 0 auto;
      z-index: 1000;
	}
	
}

/*=======================================================================*/
/* 共通設定（フッター） */
/*=======================================================================*/

@media screen and (max-width: 767px) {

	footer {
		display: block;
		width: 100%;
		margin: 0;
		padding: 0;
		border-top: 1px solid #DDDDDD;

	}

	#fWrap {
		width: 98%;
		margin: 0 auto;
		padding: 10px auto;
		background: none;
	}

	#fWrap:before, #fWrap:after {
		content: "\0020";
		display: block;
		height: 0;
		overflow: hidden;
	}

	#fWrap:after {
		clear: both;
	}

	#fCredit {
		width: 100%;
		margin: 0;
		padding: 10px;
		text-align: left;
		background: #333333;
		box-sizing: border-box;
	}

	#fCredit span{
		font-size: 0.9em;
		line-height: 1.4em;
		color: #FFF;
	}

}

/*=======================================================================*/
/* カテゴリーページ */
/*=======================================================================*/

@media screen and (max-width: 767px) {

	#category {
      width: 100%;
      margin: 0;
      overflow-x: hidden;
	}

	#category:before, #category:after {
		content: "\0020";
		display: block;
		height: 0;
		overflow: hidden;
	}

	#bodyWrap {
      width: 100%;
      margin: 10px auto;
      overflow-x: hidden;
      box-sizing: border-box;
	}

	#bodyWrap:before, #bodyWrap:after {
		content: "\0020";
		display: block;
		height: 0;
		overflow: hidden;
	}

	#bodyWrap:after {
		clear: both;
	}

	#bodyWrap #main {
		float: none;
		width: 96%;
		margin: 0 auto 10px auto;
	}

	#bodyWrap #side {
		float: none;
		width: 96%;
		margin: 0 auto;
	}

}

/*=======================================================================*/
/* 詳細ページ */
/*=======================================================================*/

@media screen and (max-width: 767px) {
	
  	.body--docs {
     width: 100%;
     margin: 0;
     padding: 0;
     overflow-x: hidden !important;
    }
  
	#page {
		width: 100%;
		margin: 0;
      	overflow-x: hidden;
	}

	/* ページ本文エリア  {{yield}} */

	#documant {
		width: 98%;
		margin: 10px auto;
		font-size: 0.9em;
	}

}

/*=======================================================================*/
/* 緊急情報 */
/*=======================================================================*/
@media screen and (max-width: 767px) {
  #topImportant time,#topImportant a{
    display : block;
  }
}