@charset "utf-8";
/* CSS Document */

article, aside, details, figcaption, figure, header, hgroup, menu, nav, section {
	display: block;
}


body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /*フォントを変更します*/
	color:#630; /*色を変更します*/
	line-height:25px; /*行間を25pxに指定します*/
	font-size:0.95em; /*フォントサイズを変更します*/
	background-color: #ffffff;
}


img {
	border:0px; /*画像ファイルの周囲に枠線が表示されるのを防ぎます*/
	  display: block;
  max-width: 100%;
  height: auto;
}



/*リンク色の変更と装飾*/

a {
	text-decoration:none;
	display: block;
  height: 100%;
}

a:link {
color:#020;
}

a:visited {
color:#430;
}

a:hover {
color:#830;
text-decoration:underline;
}

a:active {
color:#006;
}





/*h要素*/

h1 {
	font-size:2.0em; /*フォントサイズを変更します*/
	margin:10px 0px 0px 10px; /*領域間余白を0pxに指定します*/
	padding :0en; 
	line-height: 1.2; 
}

h2 {
	font-size:1.2em; /*フォントサイズを変更します*/
	margin:0px 0px 5px 0px; /*領域間余白を下方向以外0pxに指定します*/
	text-align:center;
}

.icon {
    display: inline-block;
    width: 28px;
    height: 33px;
    background: url(cpxicon01.gif) no-repeat;
  position: relative;
  /* 値は調整してください */
  top: 7px;
}



#wrap {
	max-width:970px;
        min-width:380px;
	margin:0 auto; /*領域間余白を0pxに指定し、中央寄せにします*/

}



/*ヘッダー*/




#menu {
	margin: auto; /*領域間余白を0pxに指定します*/
		min-width:380px;
	overflow: hidden;
	background: #fffcf4;
  border-radius :8px;/*角の丸み*/
  box-shadow :0px 0px 5px silver;/*5px=影の広がり具合*/
  padding:0em 0em 0em 0.7em;
}

#menu li {
	float:left; /*回り込みさせます*/
	background: #f4eef0;
	display: block;
	height: 100%;
	margin:10px 10px 5px 10px; /*領域間余白を0pxに指定します*/
	line-height:1.0;
	padding:0em 10en;
	font-size:1.1em;
}






/*コンテンツ*/

#contents {
	max-width:970px;
	margin:0 auto;/*横幅615pxを指定します*/
}




.contentsbox {
  width:device-width; 
	height:auto; /*縦幅を自動的に調整します*/
	border:solid 0px #000; /*上下左右に1px、#CCCの1本線を表示します*/
	padding:20px; /*上下左右に10pxの領域内余白を指定します*/
	margin-bottom:0px; /*下方向に15pxの領域間余白を指定します*/
		background-color:#fff; /*背景色を#FFFに指定します*/
	text-align:center;
	display: flexbox;
	}
	
.contentsbox2 {
	clear: both;
	width:device-width; 
	height:auto; /*縦幅を自動的に調整します*/
	border:solid 0px #000; /*上下左右に1px、#CCCの1本線を表示します*/
	padding:20px; /*上下左右に10pxの領域内余白を指定します*/
	margin-bottom:2px; /*下方向に15pxの領域間余白を指定します*/
		background-color:#fff; /*背景色を#FFFに指定します*/
		text-align:center;
	}
	
.text1 {
	color:#000;
	font-size:4.2em;
	}

.imagebox {
    height:  70px;             /* 高さ指定 */
    width:  280px;              /* 幅指定 */
    padding:  5px;             /* 余白指定 */
    background-color: #f9f9f9;  /* 背景色指定 */
    display:  inline-block;     /* インラインブロックにする */
    vertical-align:  bottom;    /* 下揃えにする */
	box-sizing: border-box; 
	margin:10px 0px 0px 10px;
}
p.image, p.caption {
   text-align: left; 
   margin:5px 0px 0px 10px; /* 4.余白・間隔 */
}
p.caption {
	
   font-size: 100%;  /* 5.文字サイズ */
	color:#630; /* 6.文字色 */
	line-height: 1.2;
}





.clear {
	clear:both;　/*回り込み要素を解除します*/
}





/*フッター*/

footer {
	clear:both; /*回り込みを解除します*/
	height:50px; /*縦幅は80pxですが、padding-topを30px指定しているため、80-30=50となります。そのため、heightは50pxを指定します*/
	padding-top:30px; /*要素内余白を上だけ30pxに指定します*/
	text-align:center; /*テキストを中央寄せにします*/
	font-size:0.85em; /*テキストのサイズを変更します*/
	display:block; /*ブロック要素として認識させます*/
}