@charset "utf-8"; 

/* サイト共通のデザイン（レイアウト、ヘッダー、フッター、ナビゲーション）を記述する。 */


/* レイアウト */

main { margin: 2em auto; text-align:left; width:90%; } 


/* ヘッダー */
header { background-color: #fff; box-shadow: 0 1px 4px #666; margin-bottom: 1em; }
header h1 { padding:1em 1em 0.6em; color:#123; font-size:28px; text-align:center; font-weight:bold; }
header h1 img { width:350px; }

header h1 a { color:#fff; }
header h1 a:hover { color:#eee; }

nav { margin:1em 0 0; padding:0.5em; list-style-type:none; text-align:right; }
nav li { display:inline-block; margin:0.3em; }
nav li a { padding:0.5em 1em; text-decoration:none; color:#fff; }
nav li a:hover { background-color:#346; border-radius: 6px; color:#fff; }

/* ブロック */

/* フッター */
footer { clear:both; margin-top:8em; padding:0.5em 0; background:#eee; border-top:2px solid #ccc; color:#333; line-height:1.5; }
footer #event { float:left; text-align:left; margin:3em 2em; }
footer #event img { width:200px; float:left; }
address { text-align:right; font-style:normal; margin:1em 2em; }
address dt { font-weight:bold; }




/* モニター幅960px以下 */
@media only screen and (max-width:960px) { 
main { margin: 2em auto; text-align:left; width:98%; } 

}


/* スマートフォン 横(ランドスケープ) タブレット*/
@media only screen and (max-width:768px) { 

main { float:none; width:100%; padding:1em; }
}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px) { 
}