@charset "UTF-8";

/*初期設定*/

*{
margin: 0;
padding: 0;
font-family: serif;
}

img{
max-width: 100%;
height: auto;
vertical-align: middle;/*画像の下のアキの処理*/
/*vertical-align: top;
vertical-align: bottom;*/
/*top,middle,bottom*/
/*初期値はbaseline*/
/*インライン要素やテーブルセル内の要素の縦方向の揃えを指定する
ブロックレベル要素などには効かない*/
}

iframe{
vertical-align: middle;
}

body{
min-width: 1180px;/*余裕を持たせて100px追加する*/

}

.container{
width: 800px;/*デザイン上の幅*/
margin: 0 auto;
}

header{
/*background-color: rgba(255,255,255,1);*/
width: 100%;
/*position: fixed;*//*固定する*/
/*z-index: 9999;*//*重なり順を指定するプロパティ*/

/*box-shadow: 0px 2px 5px 2px rgba(0,0,0,.2);*/
}
header h1{
width: 150px;
padding-left: 50px;
}
header .container{/*logoとnavの制御*/
display: flex;/*横並びにする*/
justify-content: space-between;/*両端揃え*/
align-items: center;/*上下センターに揃える*/
}

nav ul{
list-style-type: none;
display: flex;
}

nav a{
font-weight: bold;
color: #000;/*文字を黒くする*/
text-decoration: none;/*下線を消す*/
display: block;/*ブロックレベル要素*/
padding: 20px 50px;


}
nav a:hover{
 background-color: rgba(0,0,0,.3);
 border-radius: 10px;  
 color: #fff;
 /*text-decoration: underline;*/
 text-shadow: 1px 2px 3px #000;
}
/*footer{
	background-color: #FFE389;
	padding: 1px 0;
}*/
footer p{
font-size: 30px;
text-align: center;
margin: 20px 0;
}