@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: 800px;/*余裕を持たせて100px追加する*/
width:auto;
}

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

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

/*box-shadow: 0px 2px 5px 2px rgba(0,0,0,.2);*/
}

header .container{/*logoとnavの制御*/
display: flex;/*横並びにする*/
justify-content: space-between;/*両端揃え*/
align-items: center;/*上下センターに揃える*/

}

header h1{
/*width: 150px;*/
padding: 10px 0px;

}

nav ul{
list-style-type: none;
display: flex;
font-size: 20px;
}

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);
 color: #fff;
 border-radius: 10px;  
 /*text-decoration: underline;*/
 text-shadow: 1px 2px 3px #000;
}
.pop {

min-height: 540px;
display: block;
margin: auto;
}
/*footer{
	background-color: #FFE389;
	padding: 1px 0;
}*/
footer p{
font-size: 30px;
text-align: center;
margin: 20px 0;
}