@charset "utf-8";
/* CSS Document */
body	{ margin:0px; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size:16px;}

/* 基本 */
.wrap			{ margin:0px;}
.pageLogo img	{ width:180px; vertical-align:bottom; }

/* グリッド */
.wrap			{ display:grid; grid-template-columns:260px 1fr; grid-template-rows:160px 1fr 120px 50px; width:100%; }

/* ロゴ */
.pageLogo		{ grid-column:1; grid-row:1; padding:20px 0px; background-color:#222; text-align:center; }
.dateTime		{ grid-column:1; grid-row:1; padding:10px 0px; color:#fff; justify-items:center; padding:0px 10px 2px 0px; }
/* ナビゲーション */
.navigation		{ grid-column:1; grid-row:2/4; z-index:100; background-color:rgba(0,0,0,0.8); display:block; }
.navigation ul	{ margin:0px; padding:0px; list-style:none; line-height:0.8em; }
.navigation a	{ display:block; margin:30px; border-bottom:solid 1px #aaa; color:#fff; font-size:1.25em; text-decoration:none; }
.navMenu		{ line-height:1.2em; font-size:0.8em; }
/* メインコンテンツ */
.main			{ grid-column:2; grid-row:1/4; 
					display:grid; grid-template-colunms:1fr; grid-template-rows:150px auto auto; width:1400px; margin:auto; padding:15px; }
	/* ヘッダー */
	.header			{ grid-column:1; grid-row:1; background-color:#ffd;
	/* ヘッダー・グリッド */
					display:grid; grid-template-columns: 1fr;	grid-template-rows: repeat(3,1fr); padding:0 3px; font-family:'noto Sans Japanese',sans-serif; font-size:1em; }
		/* タイトル */
			.post_title	{ grid-column:1; grid-row:1/3;　justify-self:center; align-self:center; z-index:10; font-size:2.8125em; font-weight:900; line-height:1.2; padding:0px 0px 15px 30px; text-align:center; }
			
		/* サブタイトル */
			.post_sub1	{ grid-column:1; grid-row:2; color:#ddd; font-family:'Montserrat',sans-serif; font-size:3.375em; font-weight:900; letter-spacing:0.14em; line-height:1; margin-top:10px; text-align:center; }
			.post_sub2	{ grid-column:1; grid-row:2; color:#ddd; font-family:'Montserrat',sans-serif; font-size:3.375em; font-weight:900; letter-spacing:0.14em; line-height:1; margin-top:60px; padding-left:70px; text-align:center; }
			

	/* コンテンツ */
	.contents	{grid-column:1; grid-row:3; display:grid; grid-template-columns: auto; grid-template-rows:auto auto; grid-column-gap:15px; grid-row-gap:5px; font-size:1em;  background-color:#ffffef; padding:30px; } 
		
 ボタン
	.btn			{ display:none; }
	.buttonClose	{ display:none; }  
/* フッター */
.footer			{ grid-column:1; grid-row:4; padding:10px 0px; background-color:#222; color:#fff; text-align:center; font-size:1em; }
.footer a		{ color:#fff; text-decoration:none; cursor:pointer; }
.pageTop		{ grid-column:1; grid-row:4; justify-self:end; align-self:end; width:45px; height:auto; }
.pageTop		{ grid-column:2; grid-row:4; justify-self:end; align-self:end; width:45px; height:auto; padding-right:85px; }

/* #### 画面の横幅1260ピクル以上 #### 
@media ( min-width:1260px){
	
@media ( min-width:1260px){
	.main	{ width:1260px; margin:auto; padding:25px; }	

}
/* #### 画面の横幅768ピクル以下 #### */
@media ( max-width:768px){
	.wrap			{ grid-template-columns:1fr; }
	/* ロゴ */
	.pageLogo		{ grid-column:1; grid-row:1; padding:10px 0px; background-color:#222; text-align:center; }
	.dateTime		{ grid-column:1; grid-row:1; padding:10px 0px; color:#fff; text-align:end; padding:0px 10px 2px 0px; }	
	/* メインコンテンツ */
.main			{ grid-column:1; grid-row:2;
					display:grid; grid-template-colunms:1fr; grid-template-rows:150px auto auto; width:100% ; margin:auto; padding:5px; }
	/* ヘッダー */
	.header			{ grid-column:1; grid-row:1; background-color:#ffd;
	/* ヘッダー・グリッド */
					display:grid; grid-template-columns: 1fr;	grid-template-rows: repeat(3,1fr); padding:0 3px; font-family:'noto Sans Japanese',sans-serif; font-size:1em; }
		/* タイトル */
			.post_title	{ grid-column:1; grid-row:1/3;　justify-self:center; align-self:center; z-index:10; font-size:2.0em; font-weight:900; line-height:1.2; padding:0px 15px 15px 15px; text-align:center; }
		/* サブタイトル */
			.post_sub1	{ display:none; }
			.post_sub2	{ display:none; }
	/* コンテンツ */

	.contents	{grid-column:1; grid-row:3; padding:15px; display:grid; grid-template-columns: auto; grid-template-rows:auto auto);grid-row-gap:5px; }
	
	/* ナビゲーション */
.navigation		{ grid-column:1; grid-row:2; z-index:100; background-color:rgba(0,0,0,0.8); display:none; }
.open .navigation{ display:block; }
.navigation ul	{ margin:0px; padding:0px; list-style:none; line-height:0.8em; }
.navigation a	{ display:block; margin:30px; border-bottom:solid 1px #aaa; color:#fff; font-size:1.25em; text-decoration:none; }
/* ボタン */
.buttonOpen,
.buttonClose	{ grid-column:1; grid-row:1; justify-self:start; align-self:center; }
.buttonClose	{ display:none; }
.open .buttonOpen{ display:none; }
.open .buttonClose{ display:block; }
/* フッター */
.footer			{ grid-column:1; grid-row:3; padding:10px 0px; background-color:#222; color:#fff; text-align:center; font-size:1em; }
.footer a		{ color:#fff; text-decoration:none; cursor:pointer; }
.pageTop		{ grid-column:1; grid-row:4; justify-self:end; align-self:end; width:45px; height:auto; }
.pageTop		{ grid-column:1; grid-row:4; justify-self:end; align-self:end; width:45px; height:auto; padding-right:85px; }
	
}