@charset "UTF-8";			/*スタイルシートで使う文字エンコーディングを定義*/

*{						/*すべての要素*/
	margin:0px;				/*外側の余白0px*/
	padding:0px;			/*内側の余白0px*/
	box-sizing:border-box;	/*widthとheightにpaddingとborderのサイズを含める*/
}



body{						/*ブラウザの画面上に表示される内容全体の要素*/
	background-color: #ffffff;	/*ページ全体の背景色”白”*/
	font-family: "BIZ UDPGothic","メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", 'ＭＳ Ｐゴシック', 'Osaka', sans-serif;	/*表示するフォント指定、左にあるほど優先される*/
	font-size:120%;			/*文字サイズ120%で表示*/
	line-height:200%;		/*文字の行間200%で表示*/
}



#logo{					/*メニュー上のロゴの要素*/
	width:260px;			/*横幅260pxで表示*/
	height:80px;			/*高さ80pxで表示*/
	background-color:#ffff00;	/*背景の色”黄色”*/
	position:fixed;			/*画面の決まった位置に表示*/
}


#logo img{					/*メニュー上のロゴ画像の要素*/
	width: 220px;			/*横幅220pxで表示*/
	margin-top:10px;			/*上余白10pxで表示*/
	margin-left:10px;		/*左余白10pxで表示*/
}



#menu{					/*メニューの要素*/
	display:block;			/* ブロック要素にする */
	margin-top:80px;			/*上余白80pxで表示*/
	width:260px;			/*横幅260pxで表示*/
	line-height:50px;		/*文字の行間50pxで表示*/
	background:#f5f5f5;		/*背景の色”灰色”*/
	position:fixed;			/*メニュー画面を固定表示*/
	overflow:auto;			/*高さを超えた場合、スクロールバー表示*/
	min-height:100vh;		/*表示の最低高さ100%*/
}


#menu ul{					/*メニューの順序なしリスト要素*/
	margin-top:50px;			/*上余白50pxで表示*/
	margin-left:50px;		/*左余白50pxで表示*/
	list-style-posision:outside;	/*行頭の画像を文章の左側の位置に表示*/
}


#menu li.hake{						/*メニューの順序なしリスト要素*/
	list-style-image:url("../hake.svg");	/*行頭の画像指定*/
}


#menu li.hake2{						/*メニューの順序なしリスト要素*/
	list-style-image:url("../hake2.svg");	/*行頭の画像指定*/
}


#menu a{					/*メニューの文字要素*/
	color:#000000;			/*文字の色”黒”*/
	text-decoration:none;		/*文字の下線削除*/
}


#menu a.display{				/*メニューの文字要素*/
	color:#ff1463;			/*文字の色”赤”*/
}


#menu a:hover{				/*カーソルが乗った時にメニューの文字の色を変える*/
	color:#ff1463;			/*文字の色”赤”*/
}



.toiawase{
	height:80px;			/*高さ80pxで表示*/
	float:right;				/*文字の右側に表示*/}



.title{						/*各ページのタイトルの要素*/
	font-size:130%;			/*文字サイズ130%で表示*/
	padding-left:20px;		/*左余白20pxで表示*/
	border:solid 3px #804012;	/*3px幅で四角く囲む”茶色”*/
	background-color:#ffffff;	/*背景の色”白色”*/
	clear:both;				/*要素に対する回り込みを解除(画像の重なりを回避)*/
}



.setsumei{					/*各ページの説明の要素*/
	margin:5px;				/*上下左右余白5pxで表示*/
}



.img{						/*各ページの画像の要素*/
	display:block;			/* ブロック要素にする */
	margin:5px;				/*上下左右余白5pxで表示*/
	max-width:100%;			/*最大横幅100%で表示*/
	float:right;				/*文字の右側に表示*/
}



.shitayazirushi{				/*「下矢印」画像の要素*/
	display:block;			/* ブロック要素にする */
	margin:auto;			/*左右中央揃えで表示*/
	clear:both;				/*要素に対する回り込みを解除(画像の重なりを回避)*/
}



.yazirushi{					/*「矢印」画像の要素*/
	align-items: center;		/*上下中央揃えで表示*/
}



.highlight{					/*文字のマーカーの要素*/
	background:linear-gradient(transparent 30%,#ffff66 90%);	/*(上から)0%～30%は透明色、90%～100%は黄色、残った30%～90%はグラデーション*/
}